来自模型数组的 Ember 计算属性答案

【问题标题】：Ember computed property from model array来自模型数组的 Ember 计算属性
【发布时间】：2016-01-19 13:13:26
【问题描述】：

我有一个具有“费用”属性的模型

fees: DS.hasMany('fee')

以及具有“金额”属性的费用模型

amount: DS.attr('string')

在我的控制器中，我想要一个计算属性，它将所有费用金额加起来，所以我有这个

feeTotal: Ember.computed('model.fees.@each.amount', function() {
  var total = 0;
  this.get('model').get('fees').forEach(function(fee) {
    total += Number(fee.get('amount'));
  });
  return total;
})

这将首先计算费用，并在添加新费用时重新计算，但在费用金额更改时不会重新计算。例如，更改以下输入字段将更新金额，但不会更新计算的总数。

{{#each model.fees as |fee|}}
  {{input value=fee.amount type="number" placeholder="Fee Amount"}}
{{/each}}

我在计算属性的编写方式上遗漏了什么吗？

【问题讨论】：

把 DS.attr('string') 改成 DS.attr('number') 有效果吗？
不，它不会改变结果。问题实际上是它无法识别属性的变化，无论它是字符串还是数字。
代码对我来说看起来不错，尽管我在这里看到问题在升级 ember 后提到了类似的问题。如果你真的很绝望，你可以试试Ember 2.0。我能提供的唯一提示是，您可以使用 reduce 计算 sum 和类似的东西，并且基本上使计算函数单线。
我已将您的代码放入 Ember Twiddle 中，它似乎工作得很好。也许您没有在模板中显示feeTotal？计算属性仅在请求其值时才会被计算，例如在模板中或使用 get()。
为了澄清这里是我写的代码：gist.github.com/jonkoops/063663240a76de9e65a2

标签： ember.js ember-data

【解决方案1】：

您应该添加“model.fees.length”属性以在添加新费用后更新 totalAmount。

Ember.computed('model.fees.length', 'model.fees.@each.amount', function() {...});

我有一些想法可以试试：

-使用 DS.belongsTo() 将费用模型绑定到您的基本模型

-更改价值后节省费用

//template:
<ul>
  {{#each fees as |fee|}}
    <li>
      {{fee.amount}} - {{input type="number" value=fee.amount}} <button {{action 'save' fee}}>Save</button></li>
  {{/each}}
</ul>

//controller
actions: {
  save(fee) {
    fee.save();
  }
}

-注意“脏”值

Ember.computed('model.fees.length', 'model.fees.@each.amount', 'model.fees.@each.isDirty', function() {...});

【讨论】：

它不会改变任何东西，但如果这是一种更好的编写方式，我将不胜感激
为什么这些事情会有所作为？
我的基本模型作为一些费用，所以我有费用：DS.hasMany('fee')
我确实在更改后保存了该值，但不幸的是，这并不能解决问题。我在更改后记录了费用模型并且它是最新的，只是由于某种原因计算的属性没有捕捉到更改 =(
在看到 Jon Koops Ember Trigger 示例（并更新它以更好地适应我的实际代码）后，我感觉正在发生其他事情，不会触发控制台中的错误，但会导致计算错误属性或模型。