Компоненты Knockout 3.2 с именованными шаблонами?

Я пытаюсь использовать новую систему компонентов в нокауте 3.2.0.

На данный момент документации недостаточно, но это действительно работает.

ko.components.register('price-input', {
  template: '<span>price-input</span>'
})

Однако привязка template позволяет указать имя шаблона, которое уже существует в DOM, например:

<script type="text/html" id="price_input">
  <span>price-input</span>
</script>

Тогда вы можете сделать это:

<div data-bind="template: {name: 'price_input'}"></div>

Итак, я пробовал это:

ko.components.register('price-input', {
  template: {name: 'price_input'}
})

но он не работает. Есть ли способ использовать именованные шаблоны с новыми компонентами, или они должны быть встроенными или загружаться с помощью AMD.

Спасибо

Изменить: после ответа Р.Р. Нимейера, для пояснения здесь приведен шаблон, который я попробовал ответить:

<script type="text/html" id="ifx_price_input">
  <h4>PRICE INPUT <span data-bind="text: value"></span></h4>
</script>

Вот код компонента:

ko.components.register('price-input', {
  template: {element: 'ifx_price_input'}
})

Он загружает шаблон, но рассматривает его как экранированную строку.

Идеи?

Ответ 1

В бета-версии v3.2.0 этот случай не обрабатывался должным образом, поэтому хакерство необходимо для InternalFX.

Это будет исправлено в окончательном выпуске v3.2.0. Он будет работать так, как вы ожидаете - просто ссылайтесь на элемент script, template или textarea, и его логическое содержимое будет intepreted как узлы шаблона.

Если вам интересно, фиксация, которая исправляет и тестирует это, находится здесь: https://github.com/knockout/knockout/pull/1454

Ответ 2

Вы можете передать свойство element, которое является либо самим элементом, либо строкой, которая является id элемента типа:

template: { element: 'myTmpl' }

Ответ 3

Наконец-то решила это с некоторыми хакерами... Надеюсь, на это будут лучше отвечать разработчики нокаутов.

Это работает. В основном я просто загружаю текст шаблона вручную и передаю его функции register. Таким образом, он работает так, как если бы он был встроенным.

ko.components.register('price-input', {
  template: $('#ifx_price_input').html()
})