0

既存の値をフェッチしてビューモデルに挿入するカスタムバインディングに取り組んでいます。ただし、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/

4

1 に答える 1

0

バインディングのinit関数はwith、要素の子をコピーして「テンプレート」として使用します。このupdate部分は、その「テンプレート」に対して現在のデータを適用します。

したがって、バインディングのコードを実行すると、withバインディングinitとの中間になりupdateます。

解決策の1つは、バインディングの前にバインディングをリストすることwithです。

于 2012-12-06T22:19:54.677 に答える