我如何更新自定义绑定中的可观察对象？

Question

我有一个内部具有简单逻辑的绑定处理程序，我将在其中更新可观察对象，以便它在视图中自行更新。

这是一个示例案例，其中一切都按预期工作

我的看法：

<input data-bind="value: name" />
<hr/>
<div data-bind="fadeInText: name"></div>

代码：

ko.bindingHandlers.fadeInText = {
    update: function(element, valueAccessor) {
        ko.bindingHandlers.text.update(element,valueAccessor);//text becoz its binded to div
    } 
};

我正在尝试做这样的事情（如下），但我被困在这里 updating a observable

我的看法：

<input data-bind="value: name" />
<hr/>
<input type="text" data-bind="fadeInText: name" />
<div data-bind="text:ko.toJSON($data)"></div>

代码：

ko.bindingHandlers.fadeInText = {
    update: function(element, valueAccessor) {
            var value = valueAccessor();
    ko.bindingHandlers.value.update(element,valueAccessor);
    $(element).change(function () {
            value($(element).fadeInText('get'));
        });
    } 
};

在这个给定的场景中，当我更新 textbox-1 中的值然后 textbox-2 值得到更新时，有两个文本框。

但是当我尝试更新 textbox-2 值时，没有任何更新，我感觉很接近，但现在我无法解决这个问题。

已检查 chrome 控制台，我看到 Uncaught TypeError: undefined is not a function 但 fadeInText 存在于绑定

中

更新：

我试过allBindingsAccessor().fadeInText()我每次都得到旧值而不是新输入值。

Fiddler 提供here

有些东西用同样的方法完成但它的工作 fiddler here。

对这方面的任何帮助都很棒。

Answer 1

如果你想包装 value 绑定，你也必须调用它的 init:

ko.bindingHandlers.fadeInText = {
    init: function(element, valueAccessor, allBindings) {
        ko.bindingHandlers.value.init(element,valueAccessor, allBindings);
    },
    update: function(element, valueAccessor) {  
       var value = valueAccessor();
       ko.bindingHandlers.value.update(element,valueAccessor);
    } 
};

工作fiddle。

原因如下：当 name 可观察值发生变化时，您的 fadeInText 更新处理程序会自动调用 - 在 update 处理程序中访问它会注册它。因此，双向绑定的一半——可观察到输入字段——有效。

对于双向绑定的另一半——可观察的输入字段——你需要调用 value 绑定的 init 处理程序，因为那是 value设置事件处理程序，以便在输入字段更改时通知它。

作为一个粗略的经验法则，您使用自定义绑定的 init 部分代码，当 HTML 元素发生变化时（例如通过附加事件处理程序）更改可观察对象，和 update 部分，用于在 observable 发生变化时更改 HTML 元素。

我如何更新自定义绑定中的可观察对象？

How can i update a observable in custom bindings?

knockout.js