使用Ember.js在模板中显示模型JSON数据

Question

这在问题中很难表达，但希望我的JSON可以帮助解释。

var lodges = [
    {
        id: 1,
        lodgesName: 'Matt\'s Awesome Lodge',
        lodgeOwnersName: 'Matthew D',
        lodgeStreetAddress: '5555 J lane',
        lodgeCity: 'Salt Lake city',
        lodgeZip: '11111',
        lodgeState: 'Utah',
        favorites: [
            {
                id: 1,
                lodge_id: 2
            }
        ]
    },
    {
        id: 2,
        lodgesName: 'Some Historic Lodge',
        lodgeOwnersName: 'Santa Claus',
        lodgeStreetAddress: '1 Clearwater Road',
        lodgeCity: 'Grand Marais',
        lodgeZip: '55555',
        lodgeState: 'Minnesota',
        favorites: [
            {
                id: 1,
                lodge_id: 1
            }
        ]
    }
];

这是我的模型，其中有两个小屋。 我想使用favorites数组中的lodge_id访问每个旅馆中的favorites ，以获取具有关联旅馆ID的lodgesName 。 示例：每个旅馆所有者都有他/她“最爱”的旅馆清单。 我想查看他们喜欢的标题的列表。 在此提供的示例中，他们彼此喜欢。

我的路线是：

App.Router.map(function() {
  this.resource('lodges');  
  this.resource('lodge', {path: '/lodge/:lodge_id'}, function() {
    this.resource('favorites', function() {
        this.route('new');
    });
  });
});

我试图将一切都围绕在使用Ember的交互方式上，但是却无法弄清楚。 我需要在控制器中进行设置以使其正常工作吗？

Answer 1

使用Routes model钩子来设置连接到控制器的数据（假设可在App.lodges中找到小屋）：

App.LodgeRoute = Ember.Route.extend({
  model: function(params) {
    var lodges = App.lodges;
    return lodges.findProperty('id', params.lodge_id);
  }
});

App.FavoritesRoute = Ember.Route.extend({
  model: function() {
    var lodges = App.lodges;
    var lodge = this.modelFor('lodge');
    return lodge.favorites.map(function(favorite) {
      return lodges.findProperty('id', favorite.lodge_id);
    });
  }
});

然后在您的收藏夹模板中：

<script type="text/x-handlebars" data-template-name="favorites">
  <ul>
    {{#each content}}
      <li>{{lodgesName}}</li>
    {{/each}}
  </ul>
</script>