Question

请参阅我的小提琴here

我有几个单选按钮，根据是否选择了其中一个，我想显示一个文本框。我已经能够使用淘汰赛实现这一目标。

我要发生的是页面加载时，如果选中了“时间表”单选按钮的值，我希望显示该文本框。但是我一直无法弄清楚该怎么做。谢谢。

请参阅下面的我的基因剔除代码：

function K2ConsultantApprovalViewModel() {
  var self = this;
  self.timeSheetSelected = ko.observable("");
}
ko.applyBindings(new K2ConsultantApprovalViewModel());

Answer 1

如果将checked绑定应用于单选按钮，则当参数值等于单选按钮元素的value属性的值时，它将设置要检查的元素。因此，您需要稍微改变思维方式，并创建一个可观察到的“付款类型”以存储所选的付款类型，而不是布尔值“是否选择了时间表？”可以观察到您现在拥有的。然后，您可以首先为该可观察值赋予“时间表”值，这将是在页面加载时选择的值。根据当前选择，显示或隐藏任何其他元素也很容易。

function K2ConsultantApprovalViewModel() {
  var self = this;
  self.paymentType = ko.observable("Timesheet");
}

ko.applyBindings(new K2ConsultantApprovalViewModel());

绑定看起来像这样：

<input id="DisbursementsOrTimeSheet_ChoiceField0" type="radio" name="DisbursementsOrTimeSheetChoice" value="Disbursements" data-bind="checked: paymentType">

更新小提琴here。

更新

我不建议这样做，因为这是一种倒退的工作方式，但是如果您选中的绑定的初始值来自输入元素本身，则可以创建一个小的绑定处理程序在checked绑定之前执行。

ko.bindingHandlers['initChecked'] = { init: function (element, valueAccessor, allBindings) { var checked = valueAccessor(); if (element.checked) { checked(element.value); } } };

然后像这样绑定：

<input id="DisbursementsOrTimeSheet_ChoiceField1" type="radio" name="DisbursementsOrTimeSheetChoice" value="Timesheet" data-bind="initChecked: paymentType, checked: paymentType" checked="checked">

它将起作用（proof）。但是，执行此操作的正确方法是在视图模型中获取数据，并像有人将其放在注释中一样，切掉中间人。

Knockout.js：设置单选按钮值加载

1 个答案:

更新