Question

我有一个自定义绑定，用于在viewmodel上更改字段（“Type”）时重新初始化dom元素。这是在更新回调中定义的。

<input type="text" data-bind="value: Value, initValueField: Type()" />

ko.bindingHandlers.initValueField = {
    update:function (element, valueAccessor, allBindingsAccessor, viewModel) {
        alert('Hello World');
    }
};

有关精简版演示，请参阅此jsFiddle。

据我了解，调用更新的条件之一是：

The mechanics of custom bindings

同一数据绑定属性中的另一个绑定触发。这有助于确保价值适当的时候选项已更改。

我遇到的问题是，只要viewmodel上的值发生更改，就会调用此更新回调。

所以... 可以：

禁止其中一个绑定来调用自定义绑定。
检测自定义绑定中的调用源。

Answer 1

我在这里找到了解决问题的潜在解决方法：

Knockout.js Performance Gotcha #3 - All Bindings Fire Together

选项包括：

通过将绑定放在单独的元素（可能是容器元素）上来拆分绑定。
与第1点类似，但使用无容器绑定将它们分开。
在自定义绑定init中使用计算的observable手动管理更新。

Answer 2

您可以检查可观察的变化。然后才执行操作。像这样：

(function () {
    var cache;
    ko.bindingHandlers.initValueField = {
        init:function (element, valueAccessor, allBindingsAccessor, viewModel) {
            var currentValue = valueAccessor();
            cache = currentValue();
        },
        update:function (element, valueAccessor, allBindingsAccessor, viewModel) {
            var currentValue = valueAccessor();
            if (cache !== currentValue()) {
                alert('Hello World');
                cache = currentValue();
            }
        }
    };
}());

缓存变量存储observable的旧值。提醒仅在当前值与旧值不同时才会完成。

工作小提琴：http://jsfiddle.net/DMLzd/6/

Answer 3

您可以在自定义绑定中使用element参数来查看调用该绑定的DOM元素。请参阅自定义绑定中的http://jsfiddle.net/DMLzd/7/条件，该自定义绑定使用文本框的id属性来决定是否执行操作。我添加了另外的文本框和具有不同ID的按钮，用于调用自定义绑定。

自定义绑定中的条件更新

3 个答案: