Angular 4 reactive form Email validation by regular expression fail

The pattern is not correct as a string. In deed you are inside a string so to escape '.' you need to use double backslash like:

emailRegEx = '^[a-z0-9._%+-]+@[a-z0-9.-]+\\.[a-z]{2,4}$'

Or if you want to avoid doing so i suggest to use:

emailRegEx = /^[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$/

Edit: Keep in mind that this is a simple pattern that exclude a lot of valid email address (see RFC 5322 (sections 3.2.3 and 3.4.1) and RFC 5321). For example the angular build in email validator use the following pattern

/^(?=.{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])?)*$/