KnockoutJS 检查单选按钮绑定
KnockoutJS checked binding with radio button
我有一个对象列表,我循环遍历并为它们创建单选按钮,然后我想将选择的对象存储在一个可观察对象中,但我不知道该怎么做。 fiddle 是我尝试做的事情的示例:jsfiddle.net/whx96806/,但它不起作用。
<div data-bind="foreach: items">
<input type="radio" name="test" data-bind="checkedValue: $data, checked: $root.chosenItem" />
<span data-bind="text: itemName"></span>
</div>
<div><p>You have selected: <span data-bind="text:JSON.stringify(chosenItem())"></span></p></div>
<button data-bind="click:print">Print</button>
以及js代码:
function ViewModel () {
items= ko.observableArray([
{ itemName: 'Choice 1' },
{ itemName: 'Choice 2' }
]);
chosenItem= ko.observable();
print = function () { alert(chosenItem()); };
};
var vm = new ViewModel();
ko.applyBindings(vm);
这是 fiddle : http://jsfiddle.net/whx96806/1/
请尝试此代码段,看看是否有帮助:
var ViewModel = {
items : ko.observableArray([
{ itemName: 'Choice 1' },
{ itemName: 'Choice 2' }
]),
chosenItem : ko.observable(),
};
ko.applyBindings(ViewModel);
问题是我忘记在我的视图模型中使用 'this',这应该有效:
function ViewModel () {
this.items= ko.observableArray([
{ itemName: 'Choice 1' },
{ itemName: 'Choice 2' }
]);
this.chosenItem= ko.observable();
print = function () { alert(chosenItem()); };
};
var vm = new ViewModel();
ko.applyBindings(vm);
继承人fiddle:http://jsfiddle.net/whx96806/2/
我有一个对象列表,我循环遍历并为它们创建单选按钮,然后我想将选择的对象存储在一个可观察对象中,但我不知道该怎么做。 fiddle 是我尝试做的事情的示例:jsfiddle.net/whx96806/,但它不起作用。
<div data-bind="foreach: items">
<input type="radio" name="test" data-bind="checkedValue: $data, checked: $root.chosenItem" />
<span data-bind="text: itemName"></span>
</div>
<div><p>You have selected: <span data-bind="text:JSON.stringify(chosenItem())"></span></p></div>
<button data-bind="click:print">Print</button>
以及js代码:
function ViewModel () {
items= ko.observableArray([
{ itemName: 'Choice 1' },
{ itemName: 'Choice 2' }
]);
chosenItem= ko.observable();
print = function () { alert(chosenItem()); };
};
var vm = new ViewModel();
ko.applyBindings(vm);
这是 fiddle : http://jsfiddle.net/whx96806/1/
请尝试此代码段,看看是否有帮助:
var ViewModel = {
items : ko.observableArray([
{ itemName: 'Choice 1' },
{ itemName: 'Choice 2' }
]),
chosenItem : ko.observable(),
};
ko.applyBindings(ViewModel);
问题是我忘记在我的视图模型中使用 'this',这应该有效:
function ViewModel () {
this.items= ko.observableArray([
{ itemName: 'Choice 1' },
{ itemName: 'Choice 2' }
]);
this.chosenItem= ko.observable();
print = function () { alert(chosenItem()); };
};
var vm = new ViewModel();
ko.applyBindings(vm);
继承人fiddle:http://jsfiddle.net/whx96806/2/