使用Ember.js视图呈现集合

Question

我想使用Ember.js视图呈现集合。下面是我的要求：

1. 我不想生成两个的Metamorph脚本标记为集合中的每个项目，DOM结构应严格公正上行线路及LIS（我不介意LIS内metamorphs）
2. 我收藏中的每件商品都有一个选定的属性。根据这个属性值我想所选类别设置为LI
3. 我想在模板中定义了整个事情，并使用JavaScript的这个模板只有一个视图 - 无需额外类

使用{{each}}帮手不满足第一个要求。使用{{collection}}我无法conditionally分配CSS类到LI（我不是说这是不可能的，只是不知道如何）。看起来有可能满足1.和2.如果我的LI被定义为Ember.View，但最终我为简单用例写了大量的样板文件。

这里的jsbin与我的代码，目标是让我的名字显示为粗体，我想知道是否有可能。

Answer 1

我认为如果不编写一个项目视图类，你就无法离开。这不是太大的样板，但：

App.MyItemView = Ember.View.extend({ 
    classNameBindings: 'content.selected:selected' 
}); 

把手：

{{#collection contentBinding="view.options" itemViewClass="App.MyItemView" 
       tagName="ul" itemTagName="li"}} 
    {{view.content.selected}} – {{view.content.name}} 
{{/collection}} 

---

我的选择将是一个项目的内容包装成一个额外的元素：

{{#collection contentBinding="view.options" tagName="ul" itemTagName="li"}} 
    <div {{bindAttr class="view.content.selected:selected"}}> 
    {{view.content.selected}} &ndash; {{view.content.name}} 
    </div> 
{{/collection}} 

并相应地调整CSS：

li > .selected { 
    font-weight: bold; 
} 

这样您不需要创建视图类，但我不确定HTML结构的更改是否可以接受。