我不知道如何正确编写条件以允许在 Knockout.js 中调用 click。我设法创建了 4 个按钮,当我单击它们时,将用它们的值填充可观察数组。我想防止在该数组中传递相同的值,并且还想防止传递两个以上的值。我的起始代码是:
<table>
<tr>
<td>
<input type="button" value="1" data-bind="click: hasBeenAdded() || isFull() ? null : function() { addNumber(1); }">
</td>
<td>
<input type="button" value="2" data-bind="click: hasBeenAdded() || isFull() ? null :function() { addNumber(2); }">
</td>
<td>
<input type="button" value="3" data-bind="click: hasBeenAdded() || isFull() ? null : function() { addNumber(3); }">
</td>
<td>
<input type="button" value="4" data-bind="click: hasBeenAdded() || isFull() ? null : function() { addNumber(4); }">
</td>
</tr>
</table>
<h3>Available columns created by the user</h3>
Column: <strong data-bind="text: column"></strong>
我的 View 模型是:
function viewModel() {
var self = this;
self.hasBeenAdded = ko.observable(false);
self.isFull = ko.observable(false);
self.column = ko.observableArray();
self.addNumber = function(data) {
//console.log('Added ', data);
self.hasBeenAdded = true;
self.column.push(data);
}
if (self.column().length > 3) {
self.isFull = ko.observable(true);
}
}
你能帮我正确编写 hasBeenAdded 和 isFull bool 值来处理点击数据绑定(bind)吗?
最佳答案
我认为您想要一个按钮值数组,而不是显式创建每个值。这样,您就可以使用 foreach
,并且 click
绑定(bind)将获取该值作为其数据参数。
hasBeenAdded
应该是一个一开始为空的字典,您检查所单击的项目是否在 addNumber
内。
要正确打印列,您需要使用 foreach
或使用 join
将数组转换为字符串。
function viewModel() {
var self = this;
self.hasBeenAdded = ko.observable({});
self.numbers = [1, 2, 3, 4];
self.isFull = ko.observable(false);
self.column = ko.observableArray();
self.addNumber = function(data) {
if (!self.hasBeenAdded[data]) {
self.hasBeenAdded[data] = true;
self.column.push(data);
}
};
if (self.column().length > 3) {
self.isFull = ko.observable(true);
}
}
ko.applyBindings(new viewModel());
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<table>
<tr data-bind="foreach:numbers">
<td>
<input type="button" data-bind="value: $data, click: $parent.addNumber">
</td>
</tr>
</table>
<h3>Available columns created by the user</h3>
Column: <strong data-bind="text: column().join(',')"></strong>
关于javascript - 在knockout.js中编写组合条件以与click一起使用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34422478/