AngularJS

Angular Email Validation with Ng-Pattern

As of now, Angular thinks abc@abc is a valid email address. Technically it might be, but when it happens in real life, the chance of it being a typo is probably way larger than it being an actual email address. I want a dot to be part of that validation.

So this is what I’m having:

<form name="cardForm">
  <label translate>Email Address</label>
  <input name="email" type="email" ng-model="obj.email" ng-pattern="/^[^\s@]+@[^\s@]+\.[^\s@]{2,}$/" required>
  <div ng-messages="cardForm.email.$error">
    <div ng-message="pattern">Please enter a valid email address!</div>
  </div>
</form>

Read up on ng-messages and play with the demo at the bottom if you haven’t already encountered one. Ng-pattern’s role is to add another message with the name “pattern”.

Standard