在Ember.js中渲染hasMany数据

Question

I have an app with a users model as follows-

App.User = DS.Model.extend({
  name         : DS.attr(),
  email        : DS.attr(),
  comments       : DS.hasMany('comment'),

});

App.User.FIXTURES = [{
  id: 1,
  name: 'Jane Smith',
  email: 'janesmith@thesmiths.com',
  comments: ["1", "2"]

}, {
  id: 2,
  name: 'John Dorian',
  email: 'jd@sacredheart.com',
  comments: ["1", "2"]
}

];

And a user template to show details about an individual user as follows-

<script type = "text/x-handlebars" id = "user">
<div class="user-profile">
 {{#if deleteMode}}
            <div class="confirm-box">
                <h5>Really?</h5>
                <button {{action "confirmDelete"}}> yes </button>
                <button {{action "cancelDelete"}}> no </button>
            </div>
            {{/if}}

  <h2>{{name}}</h2>
  <span>{{email}}</span>
  <ul>
  {{#each user.comments}}
  <li>{{user.comments}}</li>
  {{/each}}
  </ul>

  <button {{action "edit"}}>Edit</button>
<button {{action "delete"}}>Delete</button>
</div>

{{outlet}}

</script>

My problem is that the user comments are not showing up on the page. Can anyone tell me what I'm doing wrong, very new to Ember. Thanks.

Answer 1

Assuming

App.Comment = DS.Model.extend({
  comment      : DS.attr(),
});

And you have fixture data for Comment

The scope has changed, so this inside your each is the comment

{{#each user.comments}}
  <li>{{comment}}</li>
  or
  <li>{{this.comment}}</li>
{{/each}}


{{#each comment in user.comments}}
  <li>{{comment.comment}}</li>
{{/each}