knockout.js - 淘汰赛计算总和

Question

我从 WCF 接收数据并将其绑定到表。我在这个论坛上得到了帮助，添加了一些计算字段，一切都很完美。我想在此表的页脚添加总计。我的页面的一个简单版本可以在http://jsfiddle.net/qeUHd/3/看到。基本上我想学习如何将一个字段添加到我的 ViewModel 中，这是我的示例“金额”中另一个字段的总和的结果。任何帮助将不胜感激。 http://jsfiddle.net/qeUHd/3/

Answer 1

在您的小提琴中，您将数据集映射到 self.model，因此 self.model 是observableArray。既然是这种情况，我只需要把一个计算值放在一起就可以得到你的总数。

http://jsfiddle.net/qeUHd/5/

self.total = ko.computed(function(){
    var total = 0;
    for(var p = 0; p < self.model().length; ++p)
    {
        total += self.model()[p].Amount();
    }
    return total;
});

然后确保绑定到它。

<td data-bind="text: total">

你做事有点落后，但我认为这是由于你接收数据的方式，所以我处理了它并继续前进。

Answer 2

虽然我通常会建议并支持将这些类型的计算字段放入视图模型中（因为它们通常属于它们所在的位置），但有时您在处理数据时很难添加额外的计算属性。例如，如果您在视图中对数据进行分组。在这种情况下，您仍然可以显示总计，但将计算移至视图：

<td data-bind="text: $data.reduce(function(x,y) { return x + y.Amount(); }, 0)"></td>