Получение содержимого пользовательского компонента knockout.js

Я пытаюсь создать пользовательский компонент в knockout.js.

HTML

<demo-widget>TEXT NEEDED</demo-widget>

Javascript

ko.components.register('demo-widget', {
    template: '<div>New Text</div>'
});

ko.applyBindings();

Компонент загружается нормально и все, но теперь я хочу получить любой контент, который был внутри оригинального тега пользовательского компонента (например, текст "TEXT NEEDED").

Есть идеи, как я могу это сделать? Надеюсь, я объяснил это достаточно ясно.

Вот скрипка: http://jsfiddle.net/WhesleyBarnard/f7bmynp5/5/

2 ответа

Решение

Почему бы не использовать атрибут params для сохранения исходного текста:

HTML:

<demo-widget params="initialValue: 'text i need to get...'"></demo-widget>

ЯШ:

ko.components.register('demo-widget', {
    template: "<div data-bind=\"text: 'content in my component. previous was: '
                                      + initialValue \">
               </div>"
});

ko.applyBindings();

Теперь это возможно (начиная с Knockout 3.3), смотрите документацию KnockoutJS здесь: Передача разметки в компоненты.

Я не буду копировать весь текст здесь, но суть:

По умолчанию узлы DOM внутри [вашего компонента] будут удалены (без привязки к какой-либо модели представления) и заменены выходными данными компонента. Однако эти DOM-узлы не теряются: они запоминаются и передаются компоненту двумя способами:

  • Как массив, $componentTemplateNodesДоступно для любого выражения привязки в шаблоне компонента (т. е. как свойство контекста привязки). Обычно это наиболее удобный способ использования поставляемой разметки. Смотрите пример ниже.
  • Как массив, componentInfo.templateNodesперешел к своему createViewModel функция

Затем компонент может выбрать использование предоставленных узлов DOM в качестве части своего вывода, как он пожелает, например, используя template: { nodes: $componentTemplateNodes } на любом элементе в шаблоне компонента.

Связанный вопрос SO: Knockout 3.2: могут ли компоненты / пользовательские элементы содержать дочерний контент?

Другие вопросы по тегам