Question

我觉得自己真的很蠢但不能让它发挥作用：）

我做了这个简单的小提琴只是为了证明我在大项目中没有遗漏任何东西。

HTML：

<div>
    Preferred flavor
    <div><input type="radio" name="flavorGroup" data-bind="checked: cherryOn" /> Cherry</div>
    <div><input type="radio" name="flavorGroup" data-bind="checked: almondOn" /> Almond</div>
    <div><input type="radio" name="flavorGroup" data-bind="checked: mgOn" /> Monosodium Glutamate</div>
</div>

JS：

var viewModel = {
    cherryOn: ko.observable(true);
    almondOn: ko.observable(false);
    mgOn: ko.observable(false);
};

ko.applyBindings(viewModel);

我希望在开始时选择Cherry。

Answer 1

来自Knockout的文档（http://knockoutjs.com/documentation/checked-binding.html）：

对于单选按钮，KO将仅当前设置要检查的元素如果参数值等于单选按钮节点的value属性。

示例：http://jsfiddle.net/btkmR/2/

<div>
    Preferred flavor
    <div><input type="radio" name="flavorGroup" value="cherry" data-bind="checked: flavor" /> Cherry</div>
    <div><input type="radio" name="flavorGroup" value="almond"  data-bind="checked: flavor" /> Almond</div>
    <div><input type="radio" name="flavorGroup" value="Monosodium"  data-bind="checked: flavor" /> Monosodium Glutamate</div>
</div>

var viewModel = {
    flavor: ko.observable("cherry")
};

ko.applyBindings(viewModel);

Answer 2

对于那些像我一样努力让它与动态绑定的无线电组名称和值合作的人，请注意data-bind中绑定的顺序。

以下操作不起作用，因为value和name在 checked后绑定：

<input type="radio" data-bind=" checked: $parent.correctAnswerId, attr: {name: 'correctAnswerFor' + $parent.id, value: id} " />

正确顺序为：

attr: {name: 'correctAnswerFor' + $parent.id, value: id}, checked: $parent.correctAnswerId

Answer 3

我也遇到了一个非常有趣的问题。如果您的单选输入值是数字并且您的模型观察值中有整数 - 将不会选择单选按钮。如果您将 observable 值更新为“1”（数字作为字符串），则它可以工作。不是很方便...

Knockout.js绑定无线电组不起作用

3 个答案: