css - 在渲染 Ember View 时添加、删除 css 类

Question

如何根据 contentBinding 的值添加、删除和更改 ember 元素的 css 类，同时执行 ember each？

在 didInsertElement 中执行类似下面的操作，但是当添加了 css 类时，基于来自 Controller 的内容值， View 元素附加到 View ，因此 css 没有被应用。

有没有其他方法可以在渲染 View 元素时执行此操作？

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");
        }

Answer 1

您可以使用 Ember.CollectionView 并指定依赖于 classNameBindings 中的content 的类。参见 API documentation , 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();​