knockout.js - 淘汰赛JS。将扩展器应用于 ViewModel 中的所有可观察对象？

Question

有没有办法在 KnockoutJS 中为 ViewModel 设置全局配置？

两个可能的用例可能是：

• 对 ViewModel 中的每个 observable 应用扩展器。例如，如果我写了一个像这里这样的修剪函数：Automatically trim whitespace from all observable values，我怎样才能将它应用于每个 observable？

查看 Knockout Validation Plugin 源代码，我看到在创建验证的Observable() 时，它实际上将所有子字段分组到一个 observableArray() 中，然后遍历并应用它obj.extend({ validatable: true });。创建这样的循环是最好的方法吗？是唯一的其他替代编写代码self.firstName = ko.observable().trimmed()吗？

• 将 defaultEvent 从“change”全局更改为“afterkeydown”。

我看到我可以使用<input data-bind="value: name, valueUpdate: 'afterkeydown'" />，但是有没有一种方法可以以编程方式或默认情况下将其应用于每个输入？这仍然是首选解决方案吗：如何让 Knockout JS 在按键上进行数据绑定而不是失去焦点？

• 最后，是否有另一种方法可以在更改和按键时触发事件？

谢谢！

Answer 1

在您想要处理多个事件时，最好使用自定义绑定：

JSFIDDLE

ko.bindingHandlers.onChange = {
    init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
        // This will be called when the binding is first applied to an element
        // Set up any initial state, event handlers, etc. here
        var value = valueAccessor();
        var el = $(element);
        el.on({
            change: function () {
                value(el.val());
            },
            keyup: function () {
                value(el.val());
            }
        });
    },
    update: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
        // This will be called once when the binding is first applied to an element,
        // and again whenever the associated observable changes value.
        // Update the DOM element based on the supplied values here.
    }
};

var model = {
    name: ko.observable('John')
};

ko.applyBindings(model);

html:

<input type="text" data-bind="onChange: name, value: name" />
<div data-bind="text: name"></div>