Question

如何更新Ember数组，使阵列中的更改也会导致视图发生变化？

这里有一些伪代码 -

cacheArr: Em.A([]),
count: 1,
updateFxn: function() {
    this.incrementProperty(count);
    devObj = Ember.object.create();
    Ember.set(devObj,"ts", this.count);
    this.cacheArr.replace(0,1, [devObj]);
},


App.ArrayComponent = Ember.Component.extend({
  refresh: function() {
    return cacheArr;
  }.property('localModel.length')
});

<script type="text/x-handlebars" id="components/new-comp">
      {{#each item in refresh}}
         {{item.ts}}
      {{/each}}
</script>

我迷惑为什么我得到异常无法读取属性＆＃39; destroy＆＃39;未定义？我找不到答案，徒劳无功。欣赏见解。

Answer 1

如果使用正确的方法（获取/设置等），Ember会监视并更新它们。对于数组，您将要使用类似的setter / getter（pushObject / removeObject / replace / objectAt等）。

App.IndexController = Em.ArrayController.extend({
  cacheArr: Em.A([]),
  count: 1,
  actions:{
    updateFxn: function(item) {
      this.incrementProperty('count');
      var newColor = {
        color:'newColor', 
        count:this.get('count')
      };
      var index = this.indexOf(item);
      this.replace(index, 1, [newColor]);
    }
  }
});

因此，当您创建计算属性时，通常希望它们观察可以更改计算属性结果的项目。让我们剖析下面的计算属性。

refresh: function() {
  return cacheArr;
}.property('localModel.length')

让我们建立一个例子：

// let's grab refresh
var refresh = this.get('refresh');

console.log(refresh);

// let's change localModel which would make refresh dirty

this.get('localModel').pushObject({foo:'bar'});

var refresh2 = this.get('refresh');

此时refresh和refresh2都完全相同，因为计算属性总是返回cacheArr（某些全局属性）;

http://emberjs.jsbin.com/jisegaca/1/edit

Ember数组更新 - 无法读取未定义的属性'destroy'

1 个答案: