CODEWITHSUNDEEP
angular6angular-forms
Dhruvi Makvana
Dhruvi Makvana

Reputation: 905

can anyone explain why we need ngModel and #nameField="ngModel" both in same input field of angular6 forms?

I am starting with my angular6 and I come across the syntax below. 

<input type="text" 
    class="form-control" 
    name="company-name"
    ngModel
    #nameField="ngModel"
    required
    minlength="3">

now my question is if ngModel and name is already there to uniquely identify form component and ngModel directive to bind it with angular form why we need #nameField="ngModel"?

We can have input value from name="company-name". so why 2 NgModels?

and what is the difference between #nameField="ngModel" and [(ngModel)]="nameField"?

Upvotes: 2

Views: 329

Answers (2)

ove
ove

Reputation: 3202

I always thought it is also needed for validation purposes so the error message show up nicely below the control.

Upvotes: 0

shokha
shokha

Reputation: 3179

To create a valid template-driven form control - you only have to add name="company-name" and ngModel.

The template reference #nameField="ngModel" can be used as a variable in your html (so it's optional).

[(ngModel)]="nameField" is the two-way data binding in Angular, aka "banana-box" (for more detailed explanation read this article two-way-data-binding-in-angular-2 or the official documentation NgModel )

Upvotes: 3

Related Questions