如何在执行 ember 时根据 contentBinding 中的值添加、删除和更改 ember 元素的 css 类?
在didInsertElement中做如下的事情,但是在添加css类时,根据控制器的内容值,视图元素附加到视图,因此css不会被应用。
在渲染视图元素时,还有其他方法可以执行此操作吗?
didInsertElement: function() {
this._super();
var personStr= this.get("content").person;
if(personStr==1){
this.$("img").addClass("add-person");
this.$("img").removeClass("view-person");
this.$("img").removeClass("edit-person");
}
}
您可以使用Ember.CollectionView
并指定依赖于classNameBindings
中的content
的类。请参阅 API 文档的 HTML 类属性部分。
请参阅此处的示例 http://jsfiddle.net/pangratz666/b4xGP/:
Ember.CollectionView.create({
content: [{name: 'Brunö'}, {name: 'Alfred'}, {name: 'Hansi'}],
itemViewClass: Ember.View.extend({
templateName: 'item',
classNameBindings: 'beginsWithA'.w(),
beginsWithA: function() {
var name = this.getPath('content.name');
if (!Ember.empty(name)) {
return name.indexOf('A') === 0;
}
}.property('content.name')
})
}).append();