KnockoutJS自定义绑定元素没有孩子?

时间:2012-12-06 20:40:00

标签: knockout.js custom-binding

我正在开发一个自定义绑定,它将获取现有值并将其插入到viewmodel中。但是,我遇到了ko.bindingHandlers中提供的元素似乎没有任何子元素的障碍。

这是KnockoutJS的工作原理还是我错过了什么?

这是我的HTML标记:

<div data-bind="with: person, useInitValueFor: ['firstName', 'lastName']">
    <div data-bind="text: firstName">John</div>
    <div data-bind="text: lastName">Doe</div>
</div>

这是我的JS代码:

ko.bindingHandlers.useInitValueFor = {
    init: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
        var $elem = $(element);
        var value = ko.utils.unwrapObservable(valueAccessor());
        var allBindings = allBindingsAccessor();

        for (var i = 0; i < value.length; i++) {
            var c = value[i];
            var e = $elem.children('[data-bind*="' + c + '"]:first');
            alert(e.length); // This gives me 0
            if (e.length > 0) {
                var a = e.attr('data-bind').split(',');
                for (var j = 0; j < a.length; j++) {
                    var b = a[j].split(':');

                    switch (b[0]) {
                        case 'text':
                            allBindings.with[c](b[1]);
                            alert(allBindings.with[c]());
                            break;
                    }
                }
            }
        }
    }
};

function personViewModel() {
    this.person = {
        firstName: ko.observable(),
        lastName: ko.observable()
    };
}

$(document).ready(function() {
    var vm = new personViewModel();
    ko.applyBindings(vm);
});

你也可以在jsFiddle上看到它:http://jsfiddle.net/dzul1983/XjD3Y/1/

1 个答案:

答案 0 :(得分:0)

with绑定的init函数复制元素的子元素以用作“模板”。 update部分将当前数据应用于该“模板”。

因此,当您的绑定代码运行时,您就在with绑定initupdate之间。

一种解决方案是在with绑定之前列出绑定。