使用 Angular6 中的域验证电子邮件 - TypeScript

在 Angular6 中，我们可以使用域验证验证电子邮件地址的域名是否正确。本文将介绍如何在 Angular6 中实现这个功能。

域验证电子邮件的实现

我们可以使用正则表达式来验证电子邮件地址的域名。在 Angular6 中，我们可以在组件的表单控制中使用 Validators.pattern() 方法来实现域验证。以下是一个示例：

import { Component } from '@angular/core';
import { FormControl, FormGroup, Validators } from '@angular/forms';

@Component({
  selector: 'app-email',
  templateUrl: './email.component.html',
  styleUrls: ['./email.component.css']
})
export class EmailComponent {

  emailFormGroup = new FormGroup({
    email: new FormControl('', [
      Validators.required,
      Validators.email,
      Validators.pattern(/^[\w-\.]+@(gmail|yahoo|hotmail)\.(com|net|org)$/i)
    ])
  });

  get email() { return this.emailFormGroup.get('email'); }

  onSubmit() {
    console.log(this.email.value);
  }

}

代码解释

我们首先导入了 FormControl、FormGroup 和 Validators 模块。然后在组件类中创建了一个 emailFormGroup 表单组，并添加了一个 email 表单控件。

在 email 表单控件中，我们使用了 Validators.required、Validators.email 和 Validators.pattern() 方法来验证电子邮件地址。

其中，Validators.pattern() 方法接受一个正则表达式参数，用来验证电子邮件地址的域名是否为指定的几种。

总结

在 Angular6 中，我们可以使用 Validators.pattern() 方法来实现电子邮件地址的域验证。使用正则表达式来验证电子邮件地址的域名是否正确。上述示例代码仅验证了几种常见的域名后缀，你也可以根据业务需要，自定义正则表达式来验证电子邮件地址的域名。