knockoutjs重写bindinghandlers

Question

您好，我正在尝试设置ko，以便在任何单击处理程序被调用时，都会运行一些自定义代码。将一些pre和post代码添加到'click‘绑定处理程序中最简单的方法是什么？

Answer 1

您可以创建包装click绑定的自定义绑定，也可以保存对click绑定的原始init和update函数的引用并替换实际的函数。

您可以选择执行update函数中的一些代码，这些代码将在更新模型值时触发(由附加在init函数中的事件处理程序或以编程方式执行)，或者将代码作为实际处理程序的一部分执行。我听起来你想要后者。

您的绑定可能如下所示：

(function() {
    var originalInit = ko.bindingHandlers.click.init,
        originalUpdate = ko.bindingHandlers.click.update;

    ko.bindingHandlers.click = {
        init: function(element, valueAccessor, allBindingsAccessor, viewModel, context) {
            var wrappedValueAccessor = function() {
                return function(data, event) {
                   //run some pre code
                   ko.bindingHandlers.click.preOnClick.call(viewModel, data, event);

                   valueAccessor().call(viewModel, data, event);

                   //run some post code
                   ko.bindingHandlers.click.postOnClick.call(viewModel, data, event);
                };

            };

            originalInit(element, wrappedValueAccessor, allBindingsAccessor, viewModel, context);
        },
        update: originalUpdate,
        preOnClick: function(data, event) {
            alert("pre code for " + data.id);
        },
        postOnClick: function(data, event) {
            alert("post code for " + data.id);
        }
    };
})();

我拆分了pre/post代码，以便在运行时可以覆盖ko.bindingHandlers.click.preOnClick或ko.bindingHandlers.click.postOnClick

下面是一个示例：http://jsfiddle.net/rniemeyer/PksAn/

如果您需要在更新函数中运行自定义代码，则可以将其拆分并在其中运行您的pre和post代码，并在两者之间执行originalUpdate。