Вложенные компоненты нокаута

Question

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

Сценарий У меня есть компонент ввода текста, который имеет метку, которая также является компонентом.

<div data-bind="component:{name:'text-input', params:{data:$data, parent:$parent}}," class="form-horizontal"> 
    <div class="form-group row"> 
     <div class="col-sm-1"> 
      <div data-bind="component:{name:'label', params:{}}"></div> 
     </div> 

     <div class="col-sm-11"> 
      <input type="text" data-bind="value:value" class="form-control" /> 
     </div> 
    </div> 
</div> 

компонент Этикетка имеет JS и шаблон, шаблон выглядит ниже

<label data-bind="text:labelText"></label> 

Но я получаю сообщение об ошибке Multiple bindings (text and component) are trying to control descendant bindings of the same element

Я понимаю <div class="col-sm-1"> элемент уже привязан к вводу текст контекста , Теперь вопрос заключается в том, как достичь этого сценария.

Answer 1

Переплет component заполняет содержимое <div> шаблоном компонента, вытирая все, что может быть внутри (отсюда и ошибка). Одним из вариантов было бы добавить еще один компонент, связанный внутри шаблона компонента text-input, который позволит передать имя_компьютера/компонентаParams в {componentName: label, componentParams: labelParams}. Вы также можете посмотреть working with component child nodes, добавленный в Knockout 3.3.

Answer 2

Фактически найдена проблема. Это глупая ошибка.

Мой зарегистрированный компонент label и в шаблоне моего лейбла я имею <label> HTML тег, но поскольку label также является компонентом, KO пытается привязать шаблон лейбла к маркирующие, который привел к ошибке и рекурсией.