Question

我有一个bool product.wantExtraInsurance，我试图通过knockoutjs绑定到一个广播组，如下所示：

<div class="btn-group" data-toggle="buttons">
   <label class="btn btn-default">
       <input type="radio" value="true" data-bind="checked: product.wantExtraInsurance" />Yes
   </label>
   <label class="btn btn-default">
       <input type="radio" value="false" data-bind="checked: product.wantExtraInsurance" />No
   </label>
</div>

小组行动无法正常工作，请您告诉我实现这一目标的最佳方法。感谢

Answer 1

要绑定单选按钮，您可以创建另一个可观察的计算机并将其绑定到单选按钮。使用您的observable将数据发送回服务器。对于无线电组选项，请为分组的项目（单选按钮）提供相同的名称。

viewmodel.js

vm.product.wantExtraInsuranceOption = ko.pureComputed({
    read: function () {
        return vm.product.wantExtraInsurance().toString();
    },
    write: function (value) {
        vm.product.wantExtraInsurance(value === "true");
    }
});

HTML：

<div class="btn-group"  data-toggle="buttons">
  <label class="btn btn-default">
    <input type="radio" name="insuranceOption" value="true" data-bind="checked: vm.product.wantExtraInsuranceOption" />Yes
  </label>
  <label class="btn btn-default">
    <input type="radio" name="insuranceOption" value="false" data-bind="checked: vm.product.wantExtraInsuranceOption" />No
  </label>
</div>

注意：请加载所有先决条件，例如knockoutJs。

Answer 2

将name属性添加到具有相同名称的按钮。这将他们分组。

如上所述@Roy J，请查看文档knockoutjs.com/documentation/checked-binding.html以获取数据绑定。

KnockoutJs绑定到单选按钮

2 个答案: