将选项传递给击倒1.3中的模板

Question

在knockoutjs 1.2.1我能做到:

<div data-bind="template: {name: 'Bar', foreach: persons, templateOptions:{fooMode: true} }"/>

<script id='Bar'>
    {{if $item.fooMode}} FOO! {{/if}}
</script>

我试图将其翻译为1.3.0beta

<div data-bind="template: {name: 'Bar', foreach: persons, templateOptions:{fooMode: true} }"/>

<script id='Bar'>
    <span data-bind="if: $item.fooMode">FOO!</span>
</script>

但新的本机模板引擎不尊重templateOptions.

还有其他方法可以将任意数据传递到模板中吗？

Answer 1

正如您所发现的,本机模板引擎不支持templateOptions哪个是jQuery Template插件options功能的包装器.

您可以采用两种方式:将数据放在视图模型上并使用$root.fooMode或$parent.fooMode在模板内部.这将是最简单的选择.

否则,如果您不想在视图模型中使用该值,则可以使用自定义绑定来操作上下文,如:

ko.bindingHandlers.templateWithOptions = {
    init: ko.bindingHandlers.template.init,
    update: function(element, valueAccessor, allBindingsAccessor, viewModel, context) {
        var options = ko.utils.unwrapObservable(valueAccessor());
        //if options were passed attach them to $data
        if (options.templateOptions) {
           context.$data.$item = ko.utils.unwrapObservable(options.templateOptions);
        } 
        //call actual template binding
        ko.bindingHandlers.template.update(element, valueAccessor, allBindingsAccessor, viewModel, context);
        //clean up
        delete context.$data.$item;
    } 
}

以下是使用中的示例:http://jsfiddle.net/rniemeyer/tFJuH/

请注意,在foreach场景中,您可以找到您的选项,$parent.$item而不仅仅是$item.

Answer 2

我建议您使用Sanderson的建议,将新文字传递给包含模型和额外数据(模板选项)的模板数据.

data-bind="template: { name: 'myTemplate', data: { model: $data, someOption: someValue } }"

工作演示http://jsfiddle.net/b9WWF/

来源https://github.com/knockout/knockout/issues/246#issuecomment-3775317