我们如何在Ember中观察数组的变化?我有一个ember组件,它使用来自模型的原始对象数据,但为了证明这个问题,我在组件本身中使用了数组属性,比如:
init:function(){
this._super();
var arr = Ember.A([
Ember.Object.create({"shelfNo": 1, "noOfItems": 2}),
Ember.Object.create({"shelfNo": 2, "noOfItems": 3}),
Ember.Object.create({"shelfNo": 3, "noOfItems": 2})]
);
this.set("someArray",arr);
//DOES NOT WORK
this.get('someArray').addArrayObserver(function () {
Ember.ObjectController.create({
arrayWillChange: function (observedObj, start, removeCount, addCount) {
console.log("in arrayWillChange");
},
arrayDidChange: function (array, start, removeCount, addCount) {
console.log("in arrayDidChange");
}
});
});
}
我也试过:
testObserver: function(){
//DOES NOT WORK
console.log("here");
}.observes('someArray@each')
但两者都不适合我!
这是一个jsbin:http://jsbin.com/EkumOjA/1/
谢谢,Dee
如果您正在观察数组中某个对象的属性,请使用someArray.@each.someProperty
。要观察数组内容何时更改(someArray.pushObject、removeObject等),请使用someArray.[]
或someArray.length
。
此外,使用someFunc: function() {}.on('init')
替代init
,这是让观察者在对象初始化时工作的安全方法。
这是您的更新代码:
App.ShowQuestionComponent = Ember.Component.extend({
someArray : null,
initializeSomeArray:function(){
var arr = Ember.A([
Ember.Object.create({"shelfNo": 1, "noOfItems": 2}),
Ember.Object.create({"shelfNo": 2, "noOfItems": 3}),
Ember.Object.create({"shelfNo": 3, "noOfItems": 2})]
);
this.set("someArray",arr);
}.on('init'),
testObserver: function(){
console.log("here");
}.observes('someArray.[]')
});
以及您更新的jsbinhttp://jsbin.com/EkumOjA/2/edit