6

当我更改它正在呈现的属性时，为什么我的模板没有得到更新？该文档指出这{{each}}是绑定感知的，但显然有一些我不知道的东西。

像 Handlebars 中的所有内容一样，{{#each}} 助手是绑定感知的。如果您的应用程序向数组中添加新项目或删除项目，则无需编写任何代码即可更新 DOM。

这是我的控制器

App.MaintemplateController = Ember.Controller.extend({
  alist: ['foo', "bar"],        
  actions : {   
    addel: function(){
            this.alist.push('xpto');
            console.log(this.alist);
     }
   }
});

在我的模板中，我有以下代码。

{{#each alist}}
    <li>{{.}}</li>
{{/each}}
<button {{action 'addel'}}>Add element</button>

数据已正确呈现，当我单击按钮时，它确实将元素附加到属性，但模板不会刷新。为什么？如何使其与我的数据保持同步？

4

1 回答 1

16

您的模板没有更新，因为您使用的是普通的 javascript而不是分别.push提供的 by ember 。Ember 默认扩展了数组原型，使其在绑定感知环境中运行良好。.pushObject.removeObject

因此，要更新您的模板，您应该执行以下操作：

App.MaintemplateController = Ember.Controller.extend({
  alist: ['foo', "bar"],        
  actions : {   
    addel: function(){
      this.get('alist').pushObject('xpto');
      console.log(this.get('alist'));
    }
  }
});

这里重要的一行是this.get('alist').pushObject('xpto'); 此外，您应该始终使用.get()and.set()来访问 ember 中的对象，否则绑定机制将不会意识到对对象所做的更改。

希望能帮助到你。

于 2013-09-05T08:52:09.620 回答