Ember 计算属性和 Handlebars 模板

Question

在我的 Ember 控制器中，我有 2 个计算属性 (CP)，如下所示；

itemsWithData: function() {
    var dataItems = [];

    return dataItems;
}.property('containsFailure'),
someArray: function() {
    var items = this.get('itemsWithData');
    var someArray = [];

    return someArray;
}.property('itemsWithData')

现在在我的 Ember Handlerbars 模板中，虽然我只使用 someArray CP 来迭代和显示值，但我没有使用其他 CP（即 itemsWithData）

但是如果我没有在我的模板中引用 itemsWithData，那么在我的控制器中也不会执行同样的操作（所以即使 someArray 也不会执行，因为它依赖于 itemsWithData）

只有当我显式添加如下虚拟引用时才会执行；

{{#each itemsWithData as |data|}}
{{/each}}

这就是 CP 在控制器/模板中的工作方式吗？我需要一种方法，这样我就不必在我的模板中添加这个虚拟代码。

Answer 1

由于您正在观察一个数组，它应该是property('itemsWithData.[]')。 '[]' 观察数组中其对象集的任何更改（即添加和删除对象），但如果这些对象的属性发生更改，则不会触发。请参阅文档here。

如果你想观察数组中每个元素的特定属性，那就是property('itemsWithData.@each.name')，它观察itemsWithData中每个元素的名称集合。如果添加或删除元素，它也会触发。请参阅文档here。

属性是惰性计算的（而观察者不是），因此将itemsWithData 添加到您的模板会强制计算itemsWithData。如果它没有在其他任何地方调用，则不会被计算。

还要注意 Ember overrides the native array。因此，如果您将Ember.EXTEND_PROTOTYPES 或Ember.EXTEND_PROTOTYPES.Array 设置为false，则观察数组可能不起作用。