使用Ember.js视图呈现集合
使用Ember.js视图呈现集合
提问于 2013-03-04 09:16:42
我想使用Ember.js视图来呈现一个集合。以下是我的要求：
- 我不想为集合中的每一项生成两个元形态脚本标记，DOM结构应该严格地只是ULs和LIs (我不介意LIs内部的变形)
- 我的集合中的每个项都有一个选定的属性。根据这个属性值，我要将选定的类设置为LI。
- 我希望在一个模板中定义整个东西，并且在JavaScript中只使用这个模板的一个视图--不需要额外的类
使用{{each}}助手并不能满足第一个需求。使用{{collection}}，我无法在条件上将CSS类分配给LI (我不是说不可能，只是不知道怎么做)。如果我的LI被定义为Ember.View，那么似乎可以满足1和2。但是最后我为简单的用例编写了许多样板。
这里是吉斯宾和我的代码，目标是以粗体显示我的名字，我想知道是否可能。
回答 1
Stack Overflow用户
发布于 2013-03-04 13:03:24
我认为，如果不编写项目视图类，您就无法逃脱。不过，这并不是什么样板：
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}} – {{view.content.name}}
</div>
{{/collection}}并相应地调整CSS：
li > .selected {
font-weight: bold;
}这样您就不需要创建视图类了，但我不确定对HTML结构的更改是否为您所接受。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/15198080
复制相关文章
相似问题
腾讯云开发者
