我有一个奇怪的问题,如果我在我的自定义绑定checkbox
上通过回调updateQuantity
更新quantity
,它将在我的自定义绑定上称我的update
功能。我使用自定义绑定的元素没有或不应该对其进行任何类型的订阅,但它再次被执行。这两次调用我的回调方法。我在那里错过了什么吗?如果我的updateQuantity
仅具有return true
,则不会调用update
函数。另外,如果我在custom binding
的update
中删除values.callback($element.is(':checked') || checked);
,它也有效。就像那条线导致订阅或其他内容。
<input type="checkbox" data-bind="checkbox: { text: 'Hello', callback: updateQuantity.bind($data) }" />
回调方法
self.quantity = ko.observable(0);
self.updateQuantity = function (checked) {
var quantity = self.quantity();
if (checked)
self.quantity(quantity + 1);
else if ((quantity - 1) >= 0) {
self.quantity(quantity - 1);
}
return false;
};
自定义绑定
ko.bindingHandlers.checkbox = {
init: function(element, valueAccessor, allBindingsAccessor) {
var values = valueAccessor();
var checked = ko.utils.unwrapObservable(values.checked);
var css = ko.utils.unwrapObservable(values.css);
var $element = $(element);
var button = $('<button type="button" class="btn btn-check ' + (values.buttonClass || '') + '" data-toggle="buttons-checkbox"><i class="' + (values.iconClass || 'icon-ok') + '"></i> ' + (values.text || '') + '</button>');
button.click(function (evt, data) {
if (typeof (values.callback) != 'undefined') {
values.callback($(element).is(':checked') || checked);
}
return true;
});
button.insertBefore(element);
},
update: function(element, valueAccessor, allBindingsAccessor) {
var values = valueAccessor();
var checked = ko.utils.unwrapObservable(values.checked);
if (typeof(values.callback) != 'undefined') {
values.callback($(element).is(':checked') || checked);
}
}
};
我在独立回调方法中使用了.peek((,并且它起作用。仍然不确定为什么会在常规检索中重新评估自定义绑定。
var quantity = self.quantity.peek();