如何在Ember.js中推送/popup数组?
我可以在Ember对象中包含数组,并使用Handlebars显示内容。 不过,我只能用set()来replace数组的内容。 如何使用push / pop / etc来修改数组的内容。 并仍然有UI绑定更新?
// JS App.obj = Ember.Object.create({ "things": ["1", "2"], }); App.obj.set("things", ["1", "2", "3"]); // Works App.obj.things.push("3"); // Doesn't Work // HTML + Handlebars {{#with App.obj}} <ul> {{#each things}} <li>{{this}}</li> {{/each}} </ul> {{/with}}
为了处理集合,Ember.js提供了一个数组包装类,Ember.Array / Ember.MutableArray
所以,而不是使用一个普通的数组,使用这些:
// JS App.obj = Ember.Object.create({ "things": Ember.A(["1", "2"]) }); App.obj.things.pushObject("3"); // pushObject notifies observers // HTML + Handlebars {{#with App.obj}} <ul> {{#each things}} <li>{{this}}</li> {{/each}} </ul> {{/with}}
使用Ember.ArrayController的一个实例,简单地用[]声明一个数组也将创buildEmber.ArrayController类的数组。
如果你想在Ember ArrayController的末尾添加一个Object,你可以使用addObject()方法。
例如。
mutableArray:[], setModel:function(){ var data1={'id':1,'name':'over'}; var data2={'id':3,'name':'out'}; this.get('mutableArray').addObject(data1); this.get('mutableArray').addObject(data2); /* To Add Object to middle of array at given index simply use the native array splice method */ var data1={'id':2,'name':'and'} this.get('mutableArray').splice(1,0,data1); return this.get('mutableArray') }.property('mutableArray')