angularangular4-forms

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?

Solution

  • 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"