1

这个问题来自我最初的第一个问题“嵌套数据，加载儿童”。

我有一个表格，其中填充了来自 JSON 的数据，其中包含嵌套对象（请参阅颜色编码）。该表包含每个可编辑的对象一行。这称为“分配”行。

这些值由 JSON 对象填充（“Values”：{“n”：4、“n2”：2 等）。

首先，我想显示每个可编辑行的总数。随着行内的值更新，总更新。这背后的用例是我想将原始总数（Allocation.Total）与可观察到的总数进行比较，因此我可以更改控件单元格上的 css 类以指示数据是否已更改。

如下图所示；（黄色表示用户更改）

http://i.stack.imgur.com/XQpLp.jpg

问题的第二部分是处理列总数。上面的问题让我有点头疼，但这个问题让我大吃一惊。因此，我将在那个问题上睡觉，然后在问题变得更清晰时更新问题。

使用简化的数据模型会产生一种复杂情况。通过说一切都是同一类型的对象，（船员）用于分配的词需要在节点有孩子时改变。如果节点有子“分配”应该称为指南。

此处的简化代码示例...

使用列部分更新... Allocated.Total 是分配的运行总计。这里的区别是这个总数是沿着表格的列计算的，而不是单行。这甚至可能吗？我的心开始有些融化了。

更新 - 4 月 26 日

对于列总计，尽管可以通过对 node1、node2、node3 进行硬编码来解决此问题。我曾希望避免这种情况，因为这些节点会根据用户/请求而变化（例如，它并不总是 node1、node2、node3）。我已经在 HTML 模板中解决了这个问题，因为可以在服务器端找到这些信息，从而使我能够交付具有正确绑定的页面。

我可以对 JavaScript 使用相同的方法，但是当我们从 API 加载数据时，必须可以动态获取此信息，然后 JavaScript 才能保持良好和干净。我一直在研究如何迭代（键、对）值，因此 node1、node2、node3 位可以变成动态的。然而，这是我陷入困境的地方。

第二部分，它变得非常复杂。总计是我所追求的一部分，但我还需要每个列的总计（星期一 - 早餐，星期一 - 午餐，星期一 - 晚餐）。这从最深的节点级联到最顶部。

救赎也是如此。所以一个人可以兑换一张票，这会一直反映到父节点。作为喜欢 XPaths 的人，这将是祖先或自我::Crew。

4

1 回答 1

1

好的。这是您的总计算量。

self.totalAllocation = ko.computed(function() {
            var values = self.Allocation.Values;
            return Number(values.node1()) + 
                   Number(values.node2()) + 
                   Number(values.node3());
})

注意节点周围的括号。这表明这些已更改为淘汰赛可观测值。在您当前的代码中，它们只是 json 值。Non-observables 可以绑定到/从敲除值/文本绑定，但是当它们的值发生变化时它们不会通知其他人。如果 totalAllocation 使用简单的 json 值，当它们通过值绑定发生更改时，它不会自动重新计算。

我更新了您的示例以使用映射插件。这将自动遍历您的所有属性并使它们成为可观察的。

分配标签是一个简单的标签。这可以通过计算和文本绑定来实现。

self.allocLabel = ko.computed(function() {
    return self.HasChildren() ? "Guide" : "Allocation";            
});

<th data-bind="text: allocLabel">Allocation</th>

我对最后一部分并不完全清楚。似乎您希望 Allocated.Total 将其所有子分配相加。这包括兑换价值吗？它应该包括它自己的分配总数吗？无论答案是什么，方法都是再次使用计算的 observable。

就像是。

self.grandTotal = ko.computed(function() {
    var result = 0;              
    for (var i = 0; i < self.Crews().length; i += 1) {
        result += self.Crews()[i].totalAllocation();
    }   
    return result;
});

你可以看到我只是遍历了 Crews 数组并对每个孩子的 totalAllocation 求和。如果您更新行分配编号，则会更新行总计和列总计。

http://jsfiddle.net/madcapnmckay/CGBZe/

编辑

如评论中所述。动态总计不应成为问题（未经测试）。

self.totalAllocation = ko.computed(function() {
     var values = self.Allocation.Values;
     var total = 0;
     for (var prop in values) { 
         total += Number(ko.utils.unwrapObservable(values[prop]));
     }
     return total;
})

希望这可以帮助。

于 2012-04-24T16:58:51.737 回答