Угловое 2 [(ngModel)] бросает ошибку при размещении между <form></form>

Question

У меня есть component.html с формой с кодом, который выглядит следующим образом:

<div *ngIf="client"> 
    //More divs 
    <form class="form-horizontal" (ngSubmit)="onSubmit()" #clientForm="ngForm"> 
     <div> 
     <input class="form-control" #name="ngModel" [(ngModel)]="client.name" required> 
     </div> 
    //End of more divs 
    </form> 
</div> 

Но я получаю сообщение об ошибке, когда оказывает проводник составляющая в HTML:

Uncaught (in promise): TypeError: undefined is not an object 

Это случается только если я помещаю входного тег между формой. Где это должно быть. Если я помещаю тег ввода выше и до тег формы, он отображает только данные с данными. Почему это могло произойти?

Answer 1

Вам не хватает вашего атрибута name на входе управления. Должно быть

<input class="form-control" name="clientName" #name="ngModel" [(ngModel)]="client.name" required> 

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

Если ngModel используется в виде тега, либо имя атрибут должен или форма Элемент управления должен быть определен как «автономный» в ngModelOptions.

Вот Plunker

Answer 2

Его не касается размещения я предполагаю, что вы еще не определили объект client, так как вы привязываетесь к client.name; Вы должны инициализировать до значения по умолчанию, как

client = {}; 

В компоненте или реальный объект клиента

PS. Я хотел бы рекомендовать вам прекратить использование NGModel с FormGroup. После того, как вы начнете использовать его, вы будете любить их :) быстро, легко и гибко