Jak przesuwać/popować tablice w Ember.js?

Question

Mogę dołączyć tablicę do obiektu Ember i wyświetlić zawartość za pomocą Handlebars. Jednak mogę tylko zastąpić zawartość tablicy za pomocą funkcji set(). W jaki sposób mogę zmodyfikować zawartość tablicy za pomocą polecenia push/pop/etc. i nadal masz aktualizację powiązań interfejsu użytkownika?

// 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}} 

Answer 1

Do pracy przy zbiorach, ember.js dostarcza klasy otoki Array, Ember.Array/Ember.MutableArray

Tak więc, zamiast przy użyciu zwykłego tablicę, z nich korzystać:

// 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}} 

Answer 2

Użyj instancji Ember.ArrayController, po prostu deklarując tablicę za pomocą [] stworzysz także tablicę klasy Ember.ArrayController.

Jeśli chcesz dodać obiekt na końcu sterownika Ember ArrayController, możesz użyć metody addObject();

np.

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')