这个问题从我的原始和第一个问题“在如下嵌套数据,载入儿童 ”。
我有填充了从包含嵌套对象JSON数据的表(参见颜色编码)。 该表包含每个对象一行是编辑。 这就是所谓的“分配”行。
这些值从JSON对象填充( “值”:{ “N”:4, “N2”:2等)。
首先,我想显示共有每个编辑一行。 当值的行内更新的全部更新。 这背后的这个用例是我想原来的总(Allocation.Total)与观察到的总比较,这样的话我可以改变对控制细胞的CSS类来表示,如果数据发生了变化。
这将在下面示出; (黄色指示的用户的变化)
http://i.stack.imgur.com/XQpLp.jpg
问题的第二部分是处理一列总。 上述问题是使我的头有点痛,但是这一次吹拂我的心灵。 因此,我会睡上一个,然后更新问题一旦它变得更清晰。
有一个其并发症如从使用简化的数据模型出现。 在这说的一切是同类型的对象,(船员)用于分配的话需要改变时,该节点的孩子。 如果节点有孩子“分配”应该叫指南。
简化的代码示例这里...
与柱体部...的Allocated.Total更新,是一个运行总的划分。 这里的区别是这个总正在向下表中的列,没有跨越单列。 这甚至可能吗? 我的心开始融化了一点。
更新-四月26日
对于列总计虽然可以通过硬编码针对节点1,节点2,节点3接近这一点。 我曾希望避免这种情况,因为这些是改变取决于用户/请求节点(例如,它不会永远节点1,节点,节点3)。 我在HTML模板解决了这个问题,因为这些信息可以发现服务器端,使我能够用正确的绑定传递寻呼。
我可以用同样的方法为JavaScript,但正如我们在加载从API数据,它必须能够动态地获取这些信息,然后JavaScript的保持非常干净。 我一直在寻找如何遍历(密钥,对)值,所以节点1,节点2,节点3位可以成为动态的。 然而,这是我得到了相当卡住。
第二部分,它变得非常复杂。 总计是什么我是后一部分,但我还需要一个总的每一列(星期一 - 早餐周一 - 午餐周一 - 晚餐)。 这级联从最深的节点,到最高层。
同样被赎回的也是如此。 所以,一个人可以兑换机票,这反映一路攀升到父节点。 正如有人谁爱的XPath,这将是祖先或自身::船员。
好。 这是你的总计算应该是什么。
self.totalAllocation = ko.computed(function() {
var values = self.Allocation.Values;
return Number(values.node1()) +
Number(values.node2()) +
Number(values.node3());
})
注意节点周围的括号。 这表明,这些已被改为淘汰赛观测。 在当前的代码,它们仅仅是JSON值。 非观测可以绑定到/从淘汰赛值/文字绑定,但是当他们的价值已经改变了他们不通知其他人。 如果totalAllocation是使用简单的JSON值,当他们通过您的值绑定改变它不会自动重新。
我更新您的示例使用映射插件。 这将通过所有的属性会自动旋转,使他们可观。
用于分配的标签是一个简单的。 这可以通过计算和文字结合来实现。
self.allocLabel = ko.computed(function() {
return self.HasChildren() ? "Guide" : "Allocation";
});
<th data-bind="text: allocLabel">Allocation</th>
我是不是在最后一部分完全清楚。 这似乎是你想要的Allocated.Total总结其所有子分配。 这是否包括赎回价值? 它应该包括它自己分配的总? 无论答案如何做到这一点是一个计算再次观察到的方式。
就像是。
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;
});
你可以看到,我只是通过船员阵列循环和总结了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;
})
希望这可以帮助。