Material angular que muestra dos mensajes de error

Nuestros mejores programadores han agotado sus provisiones de café, en su búsqueda día y noche por la respuesta, hasta que Ariana encontró el hallazgo en Bitbucket por lo tanto ahora la comparte con nosotros.

Solución:

puedes tener uno comprobar si el control es invalid y luego obtenga su mensaje de error apropiado, es decir:

 getErrorMessage() 

Y luego en tu .ts tendría una función para recuperar el mensaje de error apropiado:

getErrorMessage() 
    return this.form.controls['username'].hasError('required') ? 'You must enter a value' :
        this.form.controls['username'].hasError('pattern') ? 'Not a valid username' :
        this.form.controls['username'].hasError('minlength') ? 'Required length is at least 3 characters' :
           '';
  

no necesitas esos divsla El elemento debería ser suficiente si tiene los estilos apropiados aplicados.

Aquí hay un ejemplo de stackblitz.

Estaba teniendo el mismo problema. Esto es lo que se me ocurrió, simple y elegante. sin simultáneo mat-errorse mostrarán cuando haya dos o más. Sin embargo, todo el formulario será inválido, deshabilitando el envío.

mat-error + mat-error 
  display: none;

Recuerda que tienes autorización de agregar una reseña si diste con el hallazgo.

---

---

Utiliza Nuestro Buscador