使用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访问每个小屋内的收藏夹，以获取相关小屋ID的lodgesName。例如：每个小屋的主人都有一份他/她“最爱”的小屋列表。我想查看他们收藏的标题列表。在这个例子中，他们互相偏爱。

我的路线是：

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

我试图总结我周围的一切使用灰烬如何交互的头，但一直未能想出解决办法。我需要在控制器中设置什么才能使其工作？

Answer 1

使用路由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>