Knockout自定义绑定更新函数未启动

Question

我有一个自定义的敲除绑定，可以将切换开关设置为"打开"或"关闭"位置。我的问题是更新函数只在初始化后立即启动，而不是在可观察值发生变化时启动。你知道我做错了什么吗？

ko.bindingHandlers.toggleSwitch = {
    init: function (element, valueAccessor) {
        var valueUnwrapped = ko.utils.unwrapObservable(valueAccessor());
        var value = valueUnwrapped.value;
        var target = $(element);
        var disabled = valueAccessor().disabled;
        var id = 'ul' + (++ko.bindingHandlers['uniqueId'].currentIndex);
        var html = ['<div class="switch-mask"><ul id="' + id + '"', 'class="on-off-switch">', '<li class="on-switch">' + valueAccessor().on + '</li>', '<li class="on-off-knob"></li>', '<li class="off-switch">' + valueAccessor().off + '</li>', '</ul></div>'].join('');
        target.replaceWith(html);
        var mainTarget = $('#' + id);
        if (value()) {
            mainTarget.children('.on-switch').animate({ 'margin-left': '0px' });
            mainTarget.children('.on-off-knob').animate({ 'margin-left': '0px' });
        }
        else {
            mainTarget.children('.on-switch').animate({ 'margin-left': '-28px' });
            mainTarget.children('.on-off-knob').animate({ 'margin-left': '-1px' });
        };
        if (!disabled) {
            mainTarget.on('click', function() {
                //this fires every time the toggle switch is clicked.
                var valueUnwrapped = ko.utils.unwrapObservable(valueAccessor());
                if (value()) {
                    mainTarget.children('.on-switch').animate({ 'margin-left': '0px' });
                    mainTarget.children('.on-off-knob').animate({ 'margin-left': '0px' });
                    value(false);
                } else {
                    mainTarget.children('.on-switch').animate({ 'margin-left': '-28px' });
                    mainTarget.children('.on-off-knob').animate({ 'margin-left': '-1px' });
                    value(true);
                }
                value.valueHasMutated();
            }); 
        }
    },
    update: function (element, valueAccessor) {
        var value = valueAccessor();
        var valueUnwrapped = ko.utils.unwrapObservable(valueAccessor());
        console.log('update called');
    }
};
ko.virtualElements.allowedBindings.toggleSwitch = true;

这是我的绑定：

<!-- ko toggleSwitch:{value:data.model.Settings.HtmlEmail,on:'On',off:'Off'}-->
<!-- /ko -->

Answer 1

更新事件没有被激发，因为您没有直接绑定到可观察对象，而是绑定到一个包含名为value的属性的对象，该属性设置为可观察对象。我过去是如何做到这一点的，就是省略了自定义绑定上的update函数，只在init函数中的observable上设置了一个订阅，如下所示：

ko.bindingHandlers.toggleSwitch = {
  init: function (element, valueAccessor) {
    var valueUnwrapped = ko.utils.unwrapObservable(valueAccessor());
    var value = valueUnwrapped.value;
   /// logic omitted for clarity
    value.subscribe(function(newValue) {
        console.log('update called');
    });
    if (!disabled) {
       /// omitted for clarity
    }
  }
};