如何将多个电子邮件地址的验证添加到以逗号分隔的一个收件人字段 - Angular 5

Question

我在验证多个逗号分隔的电子邮件地址到一个收件人字段时遇到问题。我在验证一封电子邮件方面没有问题。任何指针都非常感谢。我的代码在下面谢谢。

html

<form ng-submit="onSend()" [formGroup]="sendEmailForm">
<div class="email-field">
    <mat-form-field>
      <input matInput #emailTo placeholder="to@company.ca, to@company.ca..." formControlName="toAddress">
    </mat-form-field>
</form>

打字稿

ngOnInit() {

this.sendEmailForm = this.fb.group({
  toAddress: new FormControl('', [Validators.email, Validators.required])        

});

}

我是否必须编写任何自定义验证器？

Answer 1

您可以创建自定义验证器来调用Validators.email输入值中的每封电子邮件 - stackblitz

  commaSepEmail = (control: AbstractControl): { [key: string]: any } | null => {
    const emails = control.value.split(',').map(e=>e.trim());
    const forbidden = emails.some(email => Validators.email(new FormControl(email)));
    return forbidden ? { 'toAddress': { value: control.value } } : null;
  };

并像使用它一样

this.sendEmailForm = this.fb.group({
      'toAddress': ['', [Validators.required, this.commaSepEmail]]
});