Question

我试图根据成分列表（数组）获得辅助输出营养素总量。因为我想显示许多营养素中的一种，我需要以某种方式传递一个定义所讨论的营养素的参数。所以我认为一个帮手将是要走的路，就像这样：

{{nutrient-total list "kcal"}}

问题是帮助程序只渲染/运行一次。但是，当将新项目推送到列表时，{{#each}}帮助程序会更新，因此它似乎是可能的。我想我在这里遗漏了一些东西。如果参数更改，是否应该再次运行帮助程序，还是应该尝试其他内容？

列表如下所示：

{
  ingredient: {
    name: 'Potato',
    group: 'Veggies',
    nutrients: [{
      name: 'kcal',
      nutritionalValue: 87
    }, {
      name: 'kJ',
      nutritionalValue: 42
    }]
  },
  weight: 42
}

供将来参考：

带帮助者的解决方案：

Twiddle

具有计算属性的解决方案

Twiddle

Answer 1

您可以使用计算属性

代替帮助程序

total: Ember.computed('list.[]','unit', function() {
        let total = 0;

        list.forEach(item => {
            let weight = item.get('weight');

            item.ingredient.get('nutrients').forEach(nutrient => {
                if (nutrient.name === unit) {
                    total += weight * nutrient.nutritionalValue;
                }
            });
        });
        return total;
    })

不运行帮助程序的原因可能是，我们没有更改list

的引用

Answer 2

您的列表对象是普通对象，但您处理的类似于ember对象。

我的意思是你不应该使用get。

list.forEach(item => {
    let weight = item.weight;

    item.ingredient.nutrients.forEach(nutrient => {
      if (nutrient.name === unit) {
        total += weight * nutrient.nutritionalValue;
      }
    });
  });

但是如果你想为所有类型工作，请像这样使用Ember.get：

const {get} = Ember;
...
list.forEach(item => {
    let weight = get(item, 'weight');

    get(get(item, 'ingredient'), 'nutrients').forEach(nutrient => {
      if (get(nutrient, 'name') === unit) {
        total += weight * get(nutrient, 'nutritionalValue');
      }
    });
  });

<强>更新

帮助程序不起作用的主要原因是应该通知list属性。

在行动中，您需要在结束时致电this.notifyPropertyChange('list');。

另外，为了摆脱这种情况，你可以创建一个class based helper

财产变更时助手不会重新运行

2 个答案: