1

我的问题是当我通过视图模型设置选定复选框的值时,直到我单击另一个复选框才会选中复选框。

HTML:

<input type="checkbox" data-bind="checked: selectedTags, attr: {value: '1', id: '1'}" /> 1
<input type="checkbox" data-bind="checked: selectedTags, attr: {value: '2', id: '2'}" /> 2
<input type="checkbox" data-bind="checked: selectedTags, attr: {value: '3', id: '3'}" /> 3

<button data-bind="click: alertMe">Click Me</button>

JAVASCRIPT:

function ViewModel () {
    var self = this;
    
    self.selectedTags = ko.observableArray([]);

    // I added 1 to the selected tags array
    self.selectedTags().push('1');
    
    self.alertMe = function () {
        alert(self.selectedTags());
    };
}
4

2 回答 2

3

向 an 添加项目的正确方法是直接observableArray调用(这样会通知 KO 您的数组已更改):pushobservableArray

self.selectedTags.push('1'); //no () after selectedTags

它本身并不能解决您的问题,因为您正在value使用绑定设置复选框attr,并且 Knockout(3.0 版之前)按顺序触发绑定。所以你的checked绑定首先被执行,它没有找到值,所以它不能设置你的复选框。

您可以升级到淘汰赛 3.0 来解决此问题或更改绑定的顺序:

<input type="checkbox" 
       data-bind="attr: {value: '1', id: '1'}, checked: selectedTags" /> 1
<input type="checkbox" 
       data-bind="attr: {value: '2', id: '2'}, checked: selectedTags" /> 2
<input type="checkbox" 
       data-bind="attr: {value: '3', id: '3'}, checked: selectedTags" /> 3

演示JSFiddle

于 2013-08-26T09:31:11.743 回答
0

只需编辑 HTML:

<input type="checkbox" data-bind="checked: selectedTags" value="1" id="1" /> 1
<input type="checkbox" data-bind="checked: selectedTags" value="2" id="2" /> 2
<input type="checkbox" data-bind="checked: selectedTags" value="3" id="3" /> 3

<button data-bind="click: alertMe">Click Me</button>

http://jsfiddle.net/eHj5X/6/

于 2013-08-26T09:52:43.327 回答