观察内部数组 Ember 对象的变化答案

【问题标题】：Observe changes in internal array Ember Object观察内部数组 Ember 对象的变化
【发布时间】：2016-05-20 09:32:59
【问题描述】：

我想观察在 Ember 服务中创建的 Ember 对象的变化。

export default Ember.Service.extend({
  internalCache: Ember.Object.create(),

  setInternalCache: function setTestObj(itemId, relation, content) {
    let arr, myarr, ref, internalCache;
    internalCache = this.get('internalCache');

    if (!((ref = internalCache[itemId]) != null ? ref[relation] : void 0)) {
      internalCache[itemId] || (internalCache[itemId] = {});
      internalCache[itemId][relation] = [];
    }

    arr = Ember.copy((internalCache[itemId][relation]), false);
    content.map(function (elem) {
      return arr.pushObject(elem);
    });

    myarr = internalCache[itemId][relation];
    myarr.replace(0, arr.length, Ember.copy(arr, false));
  }});

可以观察到internalCache对象的属性，但是这个对象最终会被一个内部对象填充，该对象有几个属性是数组。我想观察在这些数组上添加/删除元素时的变化。说这样的结构：

internalCache: {
  "identifier12": {
    attachments: [1, 2],
    children: [ ... ]
  }
}

attachments 数组属性是使用 setInternalCache 函数设置的，它成功地修改了 identifier12 中的 attachments 数组属性internalCache 的 strong> 属性。

到目前为止我已经尝试过：

cache: Ember.inject.service('cache');

itemAttachmentsObserver: Ember.observer('cache.internalCache.identifier12', function() {
  console.log('foo');
}).on('init')

查看嵌套修改的道具是否会触发观察者，什么都没有。

itemAttachmentsObserver: Ember.observer('cache.internalCache.identifier12.@each', function() {
  console.log('bar');
}).on('init')

和

itemAttachmentsObserver: Ember.observer('cache.internalCache.identifier12.@each.attachments.[]', function() {
  console.log('baz')
}).on('init')

但是当 attachments 数组被修改时，我无法让观察者触发。

【问题讨论】：

标签： javascript arrays ember.js

【解决方案1】：

我刚刚测试了一些可以玩的东西，它似乎可以工作，以防万一有人偶然发现同样的问题：

    itemAttachmentsObserver: Ember.observer('cache.internalCache.identifier12.attachments.@each', function () {
      var cache = this.get('cache');
    }).on('init'),

在这种情况下它会触发。

【讨论】：