Meteor returning [object Object]

Question

I'm creating a simple app to learn Meteor and am having trouble understanding how to query the DB properly. After changing the structure of my data, I now get [object Object] in my template instead of the information that was originally showing. The DB and API call seem to be working properly. I think this has something to do with my Session variables or helper function.

Here's the code:

On Client:

FiledRoutes = new Meteor.Collection('filedRoutes');

Template.routesTemplate.helpers({
filedRoutes: function() {
    return FiledRoutes.find();
  }
});

Deps.autorun(function() {
Meteor.subscribe('filedRoutes', Session.get("origin"), Session.get("destination"));
})

Template.airportForm.events({
"submit form": function(event) {

    event.preventDefault()
    var origin = $('#origin').val();
    var destination = $('#destination').val();
Session.set('origin', $('#origin').val());
Session.set('destination', $('#destination').val());
    Meteor.call("callFltAware", origin, destination, function (e, result) {
        if (!e && result) {
            console.log(result.data.RoutesBetweenAirportsExResult.data);
        }
    });
}
})

On Server:

FiledRoutes = new Meteor.Collection('filedRoutes');

Meteor.publish('filedRoutes', function(origin, destination) {
return FiledRoutes.find({airports: {origin: origin, destination: destination}});
})

Meteor.startup(function() {
// code to run on server at startup
});

var url = "http://flightxml.flightaware.com/json/FlightXML2/";
var username = "user";
var apiKey = "pass";

Meteor.methods({
callFltAware: function(origin, destination) {
    this.unblock()
  try {
    var result = HTTP.call("GET", url + 'RoutesBetweenAirportsEx', {
        auth: "user:pass",
        params: {
            origin: origin, 
            destination: destination,
            howMany: 15,
            offset: 0,
            maxDepartureAge: "10 days",
            maxFileAge: "30 days"
        }
});

var r = result.data.RoutesBetweenAirportsExResult.data; 
  for (var i = 0; i < r.length; i++) {

  var route = { 
    airports: {
        origin: origin, 
        destination: destination
            },
    route: { 
          route: r[i].route, 
          filedAltitude_max: 
          r[i].filedAltitude_max, 
          filedAltitude_min: r[i].filedAltitude_min
        }
        } 

        FiledRoutes.insert(route);


    }
    return result
  } catch (e) {
    console && console.log && console.log('Exception calling', url)
    throw e
  }
}
})

Template where I'm getting [object Object]:

<template name="routesTemplate">
<div class="filedRoute">
    {{#each filedRoutes}}
         {{>route}}
    {{/each}}
</div>

<template name="route">
<div class="route">
    <li>{{route}}</li>
</div>
</template>

This was working properly before I put origin and destination together in an object.

The "[Object object]" text appears when you convert an object to a string. That can happen in several places down the road, but a bad use of helper is a probable cause. Can you post also the code of your template? The error might be there as well. — Hubert OG
– Hubert OG, Commented Mar 3, 2014 at 21:27
Can you update your answer to also show the template html, especially the part where you use filedRoutes within your routesTemplate template? I'm guessing that's where you are seeing [object Object] — Serkan Durusoy
– Serkan Durusoy, Commented Mar 3, 2014 at 21:31

Serkan Durusoy · Accepted Answer · 2014-03-04 00:04:45Z

1

Here is the problem:

In your template, you are printing route:

<template name="route">
  <div class="route">
    <li>{{route}}</li>
  </div>
</template>

which is a javascript object (a json document) like:

airports: {
  origin: origin, 
  destination: destination
},
route: { 
   route: r[i].route, 
   filedAltitude_max: r[i].filedAltitude_max, 
   filedAltitude_min: r[i].filedAltitude_min
}

To access the properties (fields) of your document, you need to reference them in your template. For example, this would work and print out the correct strings:

<template name="route">
  <div class="route">
    <li>
      From {{route.airports.origin}} to {{route.airports.destination}}<br/>
      <i>Altitude between {{route.route.filedAltitude_min}} and {{route.route.filedAltitude_max}}</i>
    </li>
  </div>
</template>

As you see, you need to break down your object and access each key individually.

You probably had a String previously and as you iterated over your app to create a richer route document, you changed it into a document, hence the Object type.

answered Mar 4, 2014 at 0:04

Serkan Durusoy

5,4622 gold badges23 silver badges39 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Ja5onHoffman Over a year ago

Exactly what I did. Works now. Thanks!

Collectives™ on Stack Overflow

Meteor returning [object Object]

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related