knockout.js 父/子发票逻辑出库

qyyhg6bp 于 2022-11-10 发布在其他

关注(0)|答案(1)|浏览(181)

我在Knockout中遇到了父/子情况。我有一个根据数据列表（发票和详细信息）创建的表。我需要在选中表中的某些复选框时执行特定操作。
目前，我有很多工作时，复选框被选中。但只有少数目标之一是工作时，复选框被取消。我还没有能够弄清楚如何让它工作。
下面是我的jsfiddle的截图。

（来源：kingwilder.com）

目的

当一个或两个“使用点数”复选框都选中时：

在当前上下文中禁用发票和明细项目的“已核销”输入-当前正在工作
将任何和所有复选框中的到期金额（贷方金额）合计作为正值输入到顶部的金额输入中-currently working
禁用无线电（支票、信用卡、其他）-当前正在工作

当一个或两个“使用信用”复选框未选中时：

在当前上下文中为发票和明细项目启用“已核销”输入-不起作用
仅从顶部金额输入-当前正在处理中删除当前上下文的选定到期金额
启用无线电-不工作

这是我的工作jsFiddle：jsFiddle
这是当前在选中复选框时对UI进行更新的代码：

self.SelectedItems.subscribe(function(datalist){
  //console.log(ko.toJSON(item));
  var totalAmountSelected = 0;

  console.log("selected list: " + self.SelectedItems().length + " - datalist: " + datalist.length);

  ko.utils.arrayForEach(datalist, function(node){
    totalAmountSelected += parseFloat(node.amountdue() * -1);
    node.Disable(true);
    node.Parent.Disable(true);
    self.Disable(true);
  });

  self.Amount(totalAmountSelected);

});

这里要显示的代码太多，请查看小提琴。

knockout.js

来源：https://stackoverflow.com/questions/40119659/parent-child-invoice-logic-issue

1条答案

按热度按时间

xtupzzrd1#

我提出了一种方法，它使用一个绑定到复选框的布尔可观察对象，并结合一个ko.computed来收集所有选中的细节。
目前，您正在尝试将选中的“使用信用点数”框的每个值添加到数组中。
在这种方法中，每个细节都有一个useCredit可观测值，它可以是true或false。在父视图模型中，有一个计算数组计算是否至少有一个细节具有useCredit() === true。

实施：

在Detail中：

self.useCredit = ko.observable(false);

使用点数复选框的绑定方式如下：

<td>
  <div data-bind="visible: amountdue() < 0" class="usecredit">
    <input type="checkbox" data-bind="checked: useCredit" /> Use Credit
  </div>
</td>

另一个输入中的disable数据绑定可以直接绑定到求反的useCredit值：data-bind="disable: !useCredit()"
现在，开始计算payment视图模型的计算链。在Invoice中，根据所有细节计算useCredit属性：

self.useCredit = ko.computed(function() {
  return self.details().some(function(detail) {
    return detail.useCredit();
  })
});

payment中可以使用几乎相同的代码：

self.useCredit = ko.computed(function() {
  return self.invoices().some(function(invoice) {
    return invoice.useCredit();
  })
});

现在，您可以将单选按钮的disable属性绑定到useCredit，也可以将其重命名为Disable。
以下是在小提琴中实施的这些更改：https://jsfiddle.net/qLrgb9bs/
另外，如果我是你，我会删除change事件数据绑定，并使用subscriptions/computed。

赞(0）回复(0）举报 2022-11-10

我来回答

knockout.js 父/子发票逻辑出库

1条答案

实施：

相关问题

热门标签

最新问答