Angular2 use [(ngModel)] with [ngModelOptions]="{standalone: true}" to link to a reference to model's property
Using @angular/forms
when you use a <form>
tag it automatically creates a FormGroup
.
For every contained ngModel
tagged <input>
it will create a FormControl
and add it into the FormGroup
created above; this FormControl
will be named into the FormGroup
using attribute name
.
Example:
<form #f="ngForm">
<input type="text" [(ngModel)]="firstFieldVariable" name="firstField">
<span>{{ f.controls['firstField']?.value }}</span>
</form>
Said this, the answer to your question follows.
When you mark it as standalone: true
this will not happen (it will not be added to the FormGroup
).
Reference: https://github.com/angular/angular/issues/9230#issuecomment-228116474
For me the code:
<form (submit)="addTodo()">
<input type="text" [(ngModel)]="text">
</form>
throws error, but I added name attribute to input:
<form (submit)="addTodo()">
<input type="text" [(ngModel)]="text" name="text">
</form>
and it started to work.