Ember 计算的动态属性路径

Question

Ember CLI + Ember 2.1

我有一个子组件正在观察父组件上的键/值哈希，该父组件跟踪“必需”对象。

requiredObjects: {
  object1_id: true,
  object2_id: false,
  ...
}

这些对象是从 Ember-Data 检索到的记录。是否需要对象是仅与组件相关的瞬态属性，这就是为什么我不在对象本身上使用“必需”属性的原因。

有几个子组件使用不同的数据可视化显示这些对象中的一个或多个，并且每个子组件都有另一个子组件，其中包含用于需要对象的控件。

控件本身将动作发送到父控制器，并从父控制器接收 requiredList。我想做的是这个……

isRequired: Ember.computed('player', `requiredList.${this.get('player.id')}`, {
    get(key) {
        return this.get(`requiredList.${this.get('player.id')}`);
    }, 
    set(key, value) {
        this.set(`requiredList.${this.get('player.id')}`, value);
        return value;
    }
}),

但是，这不起作用。本质上，我需要观察 requiredList 中与 player.id 匹配的键何时更新，但在组件初始化并设置“player”之前我不知道 id。有没有办法做到这一点？

我考虑过使用数组而不是键/值哈希，但这需要每个控件在每次成员资格更改时循环遍历数组并查看其播放器是否在 requiredList 中。这似乎非常低效，因为列表中通常有几百个玩家，每个玩家当前在页面的不同部分呈现 2 或 3 个控件。

更新

所以将它移到 init() 中可以解决问题，尽管我不知道为什么。

init() {
    this._super(...arguments);
    this.set('isRequired', Ember.computed('player', `requiredList.${this.get('player.id')}`, {
        get(key) {
            return this.get(`requiredList.${this.get('player.id')}`);
        }, 
        set(key, value) {
            this.set(`requiredList.${this.get('player.id')}`, value);
            return value;
        }
    }));
},

Answer 1

模板化字符串使用当前上下文进行评估。

在第一种情况下，上下文实际上是模块本身，根据规范是undefined，所以requiredList.${this.get('player.id')} => requiredList.undefined。

在第二种情况下，您位于 init() 函数中，因此 this 是对象。