Передача параметров в шаблоны в нокауте 1.3 - PullRequest
5 голосов
/ 09 ноября 2011

В 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>

Но новый собственный движок шаблонов не 't уважает templateOptions.

Есть ли другой способ передать произвольные данные в шаблон?

Ответы [ 2 ]

9 голосов
/ 09 ноября 2011

Как вы обнаружили, собственный шаблонизатор не поддерживает templateOptions, который был оболочкой для функциональности options плагина jQuery Template.

Два способа, которыми вы могли бы воспользоваться: разместить свои данные намодель вашего представления и используйте $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.

8 голосов
/ 07 марта 2014

Я бы предложил предложение Сандерсона, в котором вы бы передали новый литерал в данные шаблона, которые содержат модель и дополнительные данные (параметры шаблона).

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

Рабочая демонстрация http://jsfiddle.net/b9WWF/

Источник https://github.com/knockout/knockout/issues/246#issuecomment-3775317

...