使用observable插件创建双向自定义绑定

Question

这个问题的线索似乎很难找到,我开始认为它必须是显而易见的(我缺少一些东西),无用或不可能:

我通过observables(ko.observables())得到了敲门的双向绑定.然而,所有这些括号都是真正的痛苦.因此,当我使用Durandal时,我会observable试试插件:http://durandaljs.com/documentation/Binding-Plain-Javascript-Objects.html

(为了记录,我也试过这个:http://blog.stevensanderson.com/2013/05/20/knockout-es5-a-plugin-to-simplify-your-syntax/)

两者都与淘汰赛的value绑定工作正常.

我的问题是我的应用程序有多个敲除自定义绑定,我不知道如何更新这些自定义绑定中不是ko.observable()的可观察属性.

在我的绑定中,我通常会这样做:

ko.bindingHandlers.testBinding = {
    init: function(element, valueAccessor) {
        var myObservable = valueAccessor();
        // here I could detect if it's an observable or a POJO
        // ... how to know if it's a property ???

        $(element).blur(function() {

            // ... how to write to myObservable if it's a writable property
            // ... and not a ko.observable() ???
            myObservable($(element).val());

        });

    },
    update: function(element, valueAccessor) {
        $(element).val(ko.unwrap(valueAccessor()));
    }
};

但是对于observable,我知道我需要引用底层对象和属性的名称来执行更新.(我可以得到前者,但如何得到后者？)

我已经研究value过淘汰赛的结合以试图理解但没有更多的成功......

有人会有一个简单的例子说明使用observable插件会是什么样子？任何线索将非常感激.

谢谢

Answer 1

使用Knockout的preprocess功能,您的绑定可以添加一个直接写入属性的方法.这是你如何做到的:

ko.bindingHandlers.testBinding = {
    preprocess: function(value, name, addBindingCallback) {
        addBindingCallback('testBindingWriter', 'function(v){' + value + ' = v}');
        return value;
    },
    init: function(element, valueAccessor, allBindings) {
        var value = valueAccessor();
        $(element).blur(function() {
            if (ko.isObservable(value)) {
                value($(element).val());
            } else {
                allBindings.get('testBindingWriter')($(element).val());
            }
        });
    },
    update: function(element, valueAccessor) {
        $(element).val(ko.unwrap(valueAccessor()));
    }
};

示例:http://jsfiddle.net/mbest/U7Jeg/