AngularJS: ngMessage weird behavior with input with type “email”

问题

I follow Moving from ngModel.$parsers /ng-if to ngModel.$validators /ngMessages article from Todd Motto's blog and I want to migrate from ng-if to ng-messages. But ng-messages directive behaves very weird when I try to display to user two different messages for <input type="email">: first, when user leave field empty (then required error occurs) and second, when format is wrong (then email error occurs) - it displays both required and mail messages, but my old code displays only one message - about required error - and that is I think welcomed behavior. Here is simplified code:

<form name="ngMessageMailForm">
  <input type="email" required="" name="email" ng-model="ctrl.ngMessageMail" />
  <div ng-messages="ngMessageMailForm.email.$error" ng-if="ngMessageMailForm.email.$touched">
    <span ng-message="email">
      E-mail has not proper format<br />
    </span>
    <span ng-message="required">
      E-mail is required<br />
    </span>
  </div>
</form>

Comparison between old and new code you can find in this Plunker: Ng-if vs ng-messages at plnkr.co, to reproduce weird behavior of ng-message click inside and then outside of mail inputs. You will see one message in case of ng-if form, and two messages in case of ng-message form. Did I miss something while migrating from ng-if to ng-messages? Thank you in advance for any help.

回答1:

Everything is fine but you miss to add angular-messages library to your project...

Add its files to your project and inject ngMessages to your angularjs module then you are good to go...

here is update plunker

来源：https://stackoverflow.com/questions/34252763/angularjs-ngmessage-weird-behavior-with-input-with-type-email