Ember Data: Can't access model data from template

Question

So I've been beating my head against this for a few days now. I can't get my model data to render in the template at all. No errors are being thrown, and when I insert {{model}} or {{controller}} in the template, I get a reference to the DS and Ember objects, <DS.RecordArray:ember411> , and <App.FamilyController:ember438> , respectively.

Looking in the Ember Inspector, the Data tab shows my record loaded in families, and if I click through to the object reference, and into the members/posts field, it loads the members/posts in too... so the inspector at least seems to be getting the data correctly, but the template doesn't. Any help much appreciated.

js/routes/family.js.coffee App.FamilyRoute = Ember.Route.extend model: -> @store.find 'family'

js/templates/family.hbs <img {{bind-attr src=img}} alt="Profile"> <h1>{{name}} Family</h1> <p>{{description}}</p> {{families}} {{controller}}

js/controllers/family.js.coffee App.FamilyController = Ember.ObjectController.extend({})

js/models/family.js.coffee App.Family = DS.Model.extend name: DS.attr('string') description: DS.attr('string') img: DS.attr('string') members: DS.hasMany('member', {async: true}) posts: DS.hasMany('post', {async: true}) json from API { "families": [{ "id": 2, "name": "Weebleson", "description": "Bob, Jill, Jane, John and Spot.", "img": "/images/weebleson.jpg", "member_ids": [6, 5, 4], "post_ids": [61, 62, 63, 64, 65, 66, 67, 68, 69, 70, 71, 72, 73, 74, 75, 76, 77, 78, 79, 80] }] }

Ember : 1.8.1 Ember Data : 1.0.0-beta.14.1 Handlebars : 1.0.0 jQuery : 1.11.1

Answer 1

this.store.find or @store.find in the coffeescript case returns all the models in the store. So, you are getting a list back for your model by default. It looks like there will be one family in that list.

If you want to display it in a list, you could use {{#each family in families}}{{family.name}}{{/each}}

To only get a certain ID in your FamilyRoute , you can use @store.find('family', id) . So an example would be @store.find('family', 2) . This would hit a different endpoint.

If you want to return the first result, you can use the promise that find returns:

@store.find('family').then (family) -> family.get('firstObject')