Question

我最近开始使用Ember.js。在我的小应用程序中，我目前遇到有关Ember.computed.alias的问题，因为{{#if}} - 部分已正确更新，但同一模板中的bind-attr帮助程序未相应更新。

应用程序控制器和影响该值的操作如下所示：

App.ApplicationController = Ember.ObjectController.extend({
    isEditing: false,
    actions: {
        toggleEdit: function() {
            var a = this.get('isEditing');
            this.set('isEditing', !a);
        }
    }
});

控制器会处理导致问题的模板：

App.CategoriesController = Ember.ArrayController.extend({
     needs: ['application'],
     isEditing: Ember.computed.alias('controllers.application.isEditing'),
     general: function() { // example depending on the alias
        var result = this.filterBy('type', 1);
        if (!this.get('isEditing')) {
            result = result.filterBy('isHidden', false);
         }
         return result;
     }.property('@each.type', '@each.isHidden', 'isEditing'),
     // ......

相关模板：

<ul id="categories">
    {{#if isEditing}}YES!{{else}}NO!{{/if}}
    {{#each general}}
        <li {{bind-attr class=":general isEditing:editing"}}>
            {{name}}
        </li>
    {{/each}}
</ul>

触发操作toggleEdit后，{{#if}}部分会更新并在YES!和NO!之间切换，但editing类不会应用于列表元素。我尝试将别名封装到控制器的另一个属性中，具体取决于别名，但没有成功。

我认为这是初学者的错误，但我无法弄清楚我在忽视什么。

在期待中感谢你。

Answer 1

isEditing已不在范围内，请使用controller.isEditing，抱歉电话回复

以下是一个可以将其保留在范围内的示例，但我完全有资格证明它只是为了向您展示。

{{#each item in general}}
    <li {{bind-attr class=":general controller.isEditing:editing"}}>
        {{item.name}}
    </li>
{{/each}}

Computed.alias不更新bind-attr

1 个答案: