Ember: how to show related data (Ember data) in handlebars syntax?

Question

See http://jsfiddle.net/cyclomarc/VXT53/6/

I have data in the form of:

 publication: {
        id: '1',
        title: 'first title',
        bodytext: 'first body',
        author: {
          id: '100',
          name: 'Jan'
        }
      },

I want to show in the hbs part the author name. In the publications hbs (showing each publication), I use the following syntax, but that does not work:

{{publication.author.name}}

In the publications/edit hbs (edit of one publication after selection in publications), I use the following syntax, but that does not work:

{{author.name}}

How should I access the embedded data ?

intuitivepixel intuitivepixel · Accepted Answer · 2013-08-13T15:50:27

First of, your working fiddle, sorry I ported it to jsbin since I like it more but this does not affect the functionality in any way: http://jsbin.com/ifukev/2/edit

Now to what I've changed, basically what I've done is to define that a App.Author has many publications and a App.Publication belongs to a App.Author and completed the respective FIXTURES:

App.Author = DS.Model.extend({
  name: DS.attr('string'),
  publications: DS.hasMany('App.Publication'),
  didLoad: function () {
    console.log('Author model loaded', this);
  }
});

App.Publication = DS.Model.extend({
  title: DS.attr('string'),
  bodytext: DS.attr('string'),
  author: DS.belongsTo('App.Author'),
  didLoad: function () {
    console.log('Publication model loaded', this);
  }
});

//FIXTURES DATA
App.Publication.FIXTURES = [
  {
    id: '1',
    title: 'first title',
    bodytext: 'first body',
    author: 100
  },
  {
    id: '2',
    title: 'second title',
    bodytext: 'second post',
    author: 300
  }
];

App.Author.FIXTURES = [
  {
    id: '300',
    name: 'Marc',
    publications: [2]
  },
  {
    id: '100',
    name: 'Jan',
    publications: [1]
  }
];

Hope it helps.

Ember: how to show related data (Ember data) in handlebars syntax?

1 Answers