Ionic 4 email validation with pattern - broken?


Is email validation working in Ionic 4?

I have tried and also this pattern…

[Validators.required, Validators.pattern('^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,3})$')]

…but all patterns accept the value myname@, as soon as I type the @ the validation passes?

Do I have to write a custom validator?


The above doesn’t work but replace the quotes with backslashes and it does work…

[Validators.required, Validators.pattern(/^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,3})$/)]

…not sure why, quotes seem to work in other validators??

// The Angular email validator accepts an email like "rob@example", perhaps because "rob@localhost" could be valid.
// The pureEmail regex does not accept "rob@example" as a valid email address, which I think is a good thing.
// See: EMAIL_REGEXP from

const PURE_EMAIL_REGEXP = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;

Thanks robinyo, I was confused because other pattern validation works with single quotes…e.g.

Alpha numeric and spaces…

Validators.pattern('^[a-zA-Z0-9 _-]+$')] // works

…but I think the correct technique is to not use quotes??..

Validators.pattern(/^[a-zA-Z0-9 _-]+$/)] // Also works

I’m happy with my email validator, and now the Ionic validation matches the php response I get from my server.


It is whatever the framework demands for its validator. Ionic isn’t doing the validation, but the framework is (say Angular).


Then I guess the documentation is wrong for Angular. Either way, email pattern validation only works without quotes, so I hope this information is of use to someone else.