5

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 を尊重しません。

任意のデータをテンプレートに渡す方法は他にありますか?

4

2 に答える 2

9

templateOptionsお気づきのとおり、ネイティブ テンプレート エンジンは、jQuery テンプレート プラグインの機能のラッパーであったものをサポートしていませんoptions。

2 つの方法があります: データをビュー モデルに配置し、$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。

于 2011-11-09T17:43:24.133 に答える
8

モデルと追加データ (テンプレート オプション) を含むテンプレート データに新しいリテラルを渡すという Sanderson の提案をお勧めします。

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

ワーキングデモhttp://jsfiddle.net/b9WWF/

ソースhttps://github.com/knockout/knockout/issues/246#issuecomment-3775317

于 2014-03-07T09:22:54.170 に答える