I am trying to show validate message in form in angular 2 ? I am getting this error
Cannot read property 'hasError' of undefined
I added these lines
<div *ngIf="username.hasError('required') && username.touched"
class="error-box"> username is required</div>
<div *ngIf="username.hasError('minlength') && username.touched"
class="error-box"> Minimum password length is 8!</div>
here is my code https://plnkr.co/edit/slhySWT0mJXkloGK1kfO?p=preview
This should do what you want:
<ion-input type="text" ngControl="username" #username="ngForm"></ion-input>
<div *ngIf="username.errors?.required && username.touched"
class="error-box"> username is required</div>
<div *ngIf="username.errors?.minlength && username.touched"
class="error-box"> Minimum password length is 8!</div>
?) operator, this prevents throwing error when variable is undefinederrors can be null, username not. And yes, like @PardeepJain mentioned this is to avoid error messages when errors is null. ?. is called safe-navigation or Elvis operator which only evaluates the expression after ?. when the part before is not nullusername available. I updated my answer (adding #username="ngForm" or what @yurzui explained in his answer)