委托“模板”绑定不起作用

时间:2013-11-08 22:22:30

标签: javascript user-interface data-binding web knockout.js

小提琴: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”模板。只是没有说什么就行不通。我在这里做错了什么?

1 个答案:

答案 0 :(得分: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/