javascript - 任何 View 模型 dom 更新的 Knockout JS 事件

Question

每当通过 Knockout.JS 更新 DOM 时，我需要运行一段 jquery ui 代码。我意识到这可以使用自定义绑定(bind)来完成，但这似乎与特定的 View 模型有关，我想在全局范围内进行，所以每当它发生在它触发的任何 View 模型上时？

假设我总是希望在所有带有“needsdate”类的文本框上使用 JQuery 日期选择器，而不是将其添加到我的每个 View 模型中，如果我可以在全局范围内这样做就太好了。

这可能吗？

Answer 1

如果您不打算动态添加/删除元素，那么您可以像往常一样将它们连接起来。但是，如果您正在处理动态内容(例如使用修改了其项目的 observableArray)，那么您有几个选择:

1- 喜欢答案here ，您可以创建自定义绑定(bind)。如果您不想将值绑定(bind)到 View 模型上的属性，则可以将绑定(bind)简化为:

ko.bindingHandlers.datepicker = {
    init: function(element, valueAccessor) {
        //initialize datepicker with some optional options
        var options = ko.utils.unwrapObservable(valueAccessor());
        $(element).datepicker(options);

        //handle disposal (if KO removes by the template binding)
        ko.utils.domNodeDisposal.addDisposeCallback(element, function() {
            $(element).datepicker("destroy");
        });
    }
}; 

你可以将它放在如下元素上:

<input data-bind="datepicker: { minDate: new Date() }" />

2- 另一个选项是使用 afterRender functionality的 template (以及使用 foreach 的 template)在呈现新内容后连接您的日期选择器。