在ember中通过无关模板中的模型循环

时间:2014-08-07 16:15:10

标签: ember.js

如果我在这里遗漏了一些关键概念,我道歉。我是ember的新手,并不觉得我从根本上“得到它”。

在我正在处理的应用程序中,有一个侧边栏需要显示所有用户的相册,而不管用户所在的路线。

在这个侧边栏模板的内部,我想做一些像这样的事情,我为每张专辑渲染一个专辑模板。

{{#each App.AlbumsController}}
  {{render "albums.album_link" this}
{{/each}}

编辑:重要的是,我不希望相册成为应用程序控制器的模型,因为我想在同一个侧边栏中至少再渲染一个模型并能够在它们之间切换。

基于以下建议:Sort content of ArrayController(不确定{{#view App.RecordView}}是什么。这很重要吗?)

我没有'专辑'路线,因为这个侧边栏是唯一一个显示专辑索引的地方,并且它不需要自己的视图。

App.AlbumsController = Ember.ArrayController.extend({
  content: [],
  sortProperties: ['title'],
  sortAscending: false 
});   

当评估它时,它在控制台中出现错误:未捕获错误:断言失败:#each循环的值必须是数组。你传递了App.AlbumsController

我认为我的问题在于我不明白arrayController上的“content”属性是什么,我可能没有正确设置它以将相册对象加载到控制器中

我创建了一个垃圾箱,但我未能尝试在侧边栏模板中循环播放相册:http://jsbin.com/nufusa/9/edit

2 个答案:

答案 0 :(得分:1)

如果所有路线的侧边栏内容相同,最简单的方法是将相册定义为应用路线模型:

# Route
var App.ApplicationRoute = Em.Route.extend({
  model: function() {
    # Retrieve your albums, depending on where you store that data
  }
})

# Outernmost template (application.hbs)
<div class="sidebar">
  {{#each}}
    {{render "albums.album_link" this}}
  {{/each}}
</div>
<div class="main">
  {{ outlet }}
</div>

如果不同的路线有不同的侧边栏,请使用插座显示侧边栏。您可以像这样定位侧栏插座:

var App.SomeRoute = Ember.Route.extend({
  renderTemplate: function() {
    this.render();
    this.render('sidebar/something', {
      into: 'application',
      outlet: 'sidebar'
    });
  }
});

您可以在ember指南中找到有关在插座中渲染模板的更多信息:http://emberjs.com/guides/routing/rendering-a-template/

答案 1 :(得分:0)

要使这一点正确,而不是:

App.AlbumsController = Ember.ArrayController.extend({
  content: [],
  sortProperties: ['title'],
  sortAscending: false 
});  

重要的是创建而不是将ArrayController扩展为一行,然后单独设置它的属性。

App.albumsController = Ember.ArrayController.create();

App.albumsController.set('sortProperties', ['title']);
App.albumsController.set('content', App.Album.FIXTURES);

工作js.bin:http://jsbin.com/nufusa/10/edit