Шаблоны нокаута с Wijmo

Я пытаюсь динамически добавить вкладку к вкладкам Wijmo с помощью Knockout, но получаю исключение после применения привязки

addSingleExecution: (execution) ->
      tabName =  "#tabs-#{@tabCounter}"
      tabs  = $(@targetDomElement).wijtabs(
        tabTemplate: '<li><a href="#{href}">#{label}</a> <span class="ui-icon ui-icon-close">Remove Tab</span></li>'
        add: (event,ui) ->
          $(ui.panel).append('<div data-bind="template: { name: singleExecutionTemplate }"/>')
          $(ui.tab).siblings('span.ui-icon-close').on('click', null,self, (event)->
            index = $('li', tabs).index($(this).parent());
            tabs.wijtabs('remove', index);
          )
      )

      tabs.wijtabs('add',tabName,moment(execution.date()).format('DD MMM YYYY'))
      ko.applyBindings(execution,$(tabName)[0])
      @tabCounter++

Точнее, исключение, которое я получаю, находится в строке 3008 отладки нокаута 2.2.1:

Uncaught TypeError: Cannot read property 'length' of null 
 // Loosely check result is an array of DOM nodes
        if ((typeof renderedNodesArray.length != "number") || (renderedNodesArray.length > 0 && typeof renderedNodesArray[0].nodeType != "number"))
Uncaught TypeError: Cannot read property 'length' of null
            throw new Error("Template engine must return an array of DOM nodes");

это мой шаблон

<script type="text/html" id="singleExecutionTemplate">
    <div>
        <ul>
            <li>
                <h1>Step 1</h1>
                Setup input data
            </li>
            <li>
                <h1>Step 2</h1>
                This is the second step.
            </li>
            <li>
                <h1>Step 3</h1>
                Analyse result and record
            </li>
        </ul>
        <div>
            Setup
        </div>
        <div>
            Run
        </div>
        <div>
            Analyse
        </div>
    </div>
</script>

Почему не отображается правильно?


templates wijmo knockout.js
person Edmondo1984    schedule 26.03.2013    source источник

Ответы (2)


arrow_upward
3
arrow_downward

Я столкнулся с этим, когда переключался на использование шаблона Razor в ASP.Net MVC. Разница в разметке была незначительной, и я бы никогда не понял свою ошибку без ответа, данного Edmondo1984.

Да, это должно быть строковым свойством. С Razor мне пришлось изменить свой, чтобы он выглядел так:

<div data-bind="template: { name: '@Model.TemplateName' }"></div>

Надеюсь, это поможет.

person AggieEric    schedule 29.05.2013

arrow_upward
1
arrow_downward

Проблема возникает со следующей строкой:

 $(ui.panel).append('<div data-bind="template: { name: singleExecutionTemplate }"/>')

Имя шаблона должно быть строковым свойством:

$(ui.panel).append('<div data-bind="template: { name: 'singleExecutionTemplate' }"/>')

работает правильно

person Edmondo1984    schedule 27.03.2013