0

フィドル: http://jsfiddle.net/ZA5k9/

したがって、次のようなテンプレートバインディングのショートカットを作成したいと思います:

ko.bindingHandlers.shortcut = {
        init: function(element, valueAccessor, allBindings, viewModel, bindingContext) {
            var data = valueAccessor();
            var nextValueAccessor = function () {
                return  { name: 'someTemplate', data: data };
            };
            ko.bindingHandlers.template.init.call(this, element, nextValueAccessor, allBindings, viewModel, bindingContext);
        }
}

HTML:

<div data-bind="shortcut: 'Hey!'"></div>
<script type="text/html" id="someTemplate">
   <div data-bind="text: $data"></div>
</script>

「someTemplate」テンプレートが定義されています。何も言わないとうまくいきません。ここで何が間違っていますか？

4

1 に答える 1

5

あなたの問題は本質的updateに、テンプレート バインディングの関数を呼び出していないことです。ただし、わずかに異なるアプローチを使用してバインディングをラップする方が簡単な場合があるため、init関数を使用するだけで済みます。

ko.bindingHandlers.shortcut = {
        init: function(element, valueAccessor, allBindings, viewModel, bindingContext) {

            ko.applyBindingAccessorsToNode(element, {
                template: function() {
                    return {
                        name: 'someTemplate',
                        data: valueAccessor()
                    };
                }
            }, bindingContext)

            return { controlsDescendantBindings: true };
        }
};

サンプル: http://jsfiddle.net/rniemeyer/RXu9t/

まだ KO 2.x を使用している場合は、ko.applyBindingsToNode代わりに次のように使用します。

        ko.applyBindingsToNode(element, {
            template: {
                name: 'someTemplate',
                data: valueAccessor()
            }
        }, bindingContext);

サンプル: http://jsfiddle.net/rniemeyer/79yG8/

于 2013-11-08T23:01:06.110 に答える