When working with a reactive Angular form like the one below:
buildForm(): void {
this.registrationForm = this.fb.group({
'email': [this.user.email, [
Validators.required,
Validators.email
]],
});
I'm looking for a way to prevent Angular from displaying both the "email is required" and "email is invalid" messages simultaneously after the required validator fails. Is there a simpler or pre-built method to achieve this, other than creating a custom validator?
I'm currently using Angular 4.0.2