我是 knockout 新手,我一直在寻找以下问题的答案,但没有找到答案: 我有几个单选按钮列表,我想将所选单选按钮的选定值存储在数组中的每个单选按钮列表中(数组中的第一个索引应包含第一个单选按钮列表中的选定值,依此类推)。这可以通过任何方式完成吗?
请参阅下面的代码以了解我想要做什么。基本上我想将选定的单选按钮值存储在 observableArray selectedProducts 中。
function Product(id, name, room) {
this.id = id;
this.name = name;
this.room = room;
}
var listOfProds = [
new Product(1, 'Prod1', 1),
new Product(2, 'Prod2', 1),
new Product(3, 'Prod3', 1),
new Product(1, 'Prod1', 2),
new Product(2, 'Prod2', 2),
new Product(3, 'Prod3', 2)
];
var viewModel = {
products: ko.observableArray(listOfProds),
selectedProducts: ko.observableArray()
};
ko.applyBindings(viewModel);
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<ul data-bind="foreach: products">
<li>
<input type="radio" data-bind="attr: {name: 'room'+room}, checkedValue: $data, checked: $root.selectedProducts" />[
<span data-bind="text: room"></span>]
<span data-bind="text: name"></span>
</li>
</ul>
<hr/>
<div data-bind="text: ko.toJSON($root)"></div>
最佳答案
您可以尝试绑定(bind)onclick事件并手动制作selectedProducts。
HTML:
<input type="radio" data-bind="attr: {name: 'room'+room}, click: $root.addSelectedElement" />
点击绑定(bind):
self.addSelectedElement = function(data) {
var productInRoomArr = self.selectedProducts().filter(function(product) {
return product.room == data.room;
});
if (productInRoomArr.length > 0) {
var productInRoom = productInRoomArr[0];
if (productInRoom.id == data.id)
return true;
var index = self.selectedProducts.indexOf(productInRoom);
if (index > -1) {
self.selectedProducts.splice(index, 1);
}
}
self.selectedProducts.push(data);
return true;}
关于javascript - 将 knockout 单选按钮值中的值存储在可观察数组中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28149013/