javascript - ¿Cómo validar direcciones de correo electrónico separadas por comas y limitar la dirección de correo electrónico en angular?

Tengo un requisito de ingresar solo 50 direcciones de correo electrónico en el cuadro de texto. Estoy utilizando una expresión regex para validar las direcciones de correo electrónico, ya que también debo restringir el nombre de dominio. Todo en lo que estoy atascado ahora es que no puedo escribir una validación para restringir las entradas hasta 50 direcciones de correo electrónico.

emailPattern = /^\w+([-+.']\w+)*@abc.com(, ?\w+([-+.']\w+)*@abc.com)*$/;

Por favor, consulte mi código en el enlace a continuación.

https://stackblitz.com/edit/angular-wfwfow

Respuesta #1

Hay un validador de correo electrónico en @angular/forms.

Puedes obtener la expresión regular del código fuente de los validadores de correo electrónico:

const EMAIL_REGEXP =
    /^(?=.{1,254}$)(?=.{1,64}@)[-!#$%&'*+/0-9=?A-Z^_`a-z{|}~]+(\.[-!#$%&'*+/0-9=?A-Z^_`a-z{|}~]+)*@[A-Za-z0-9]([A-Za-z0-9-]{0,61}[A-Za-z0-9])?(\.[A-Za-z0-9]([A-Za-z0-9-]{0,61}[A-Za-z0-9])?)*$/;

O simplemente úsalo para crear un validador personalizado para múltiples correos electrónicos :

function validateEmails(emails: string) {
  return (emails.split(',')
    .map(email => Validators.email(<AbstractControl>{ value: email }))
    .find(_ => _ !== null) === undefined);
}

function emailsValidator(control: AbstractControl): ValidationErrors | null {
  if (control.value === '' || !control.value || validateEmails(control.value)) {
    return null
  }
  return { emails: true };
}

Luego use el validador personalizado :

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

Aquí hay un fork de tu código con la solución sugerida.

Respuesta #2

Las direcciones de correo electrónico solo pueden contener caracteres alfanuméricos más los símbolos especiales !#$%’*+-/=?^_`{|}~. Tenga en cuenta que las comas no son partes válidas de la dirección.

Como tal, la forma más sencilla sería simplemente dividir la cadena por comas y luego evaluar cada dirección. Al mismo tiempo, puedes limitar o recortar el número de direcciones. Parece que tu código ya está dividiendo por comas, así que una vez que lo hayas hecho, puedes simplemente hacer algo como:

if(emailList.length > 50) 
   /* display an error or truncate the list */
else 
   /* iterate over the list and test each address */