Angular 5-表单验证电子邮件 [英] Angular 5 - form validation e-mail

问题描述

我想解决这个问题: Angular 5-模板驱动表单

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

有任何提示吗?

推荐答案

您可以简单地将其他条件传递到ngIf指令中，以检查输入的当前值是否为空字符串.

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"

这篇关于Angular 5-表单验证电子邮件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！