[Fixed] Angular 5 – form validation e-mail


i want to solve this problem:
Angular 5 – template driven form

An input-field has type email. Example:

<input type="email" [(ngModel)]="model.email" #email="ngModel" email />

I want to validate this field. But it should not be a required field.
The validation should only start, if it isn’t empty.
If the field is empty, everthing is fine. Otherwise an error message should be displayed until the e-mail adress is correct.

This is not realy working:

*ngIf="email.untouched && email.invalid"

So, how can i validate the email field?
I miss a status like “not empty”.

Any hint?


You can simply pass additional condition into the ngIf directive to check if the current value of the input is empty string.

*ngIf="email.value !== '' && email.untouched && email.invalid"

Leave a Reply

(*) Required, Your email will not be published