AngularJS：输入类型为 "email" 的 ngMessage 异常行为

Question

我关注 Moving from ngModel.$parsers /ng-if to ngModel.$validators /ngMessages article from Todd Motto's blog，我想从 ng-if 迁移到 ng-messages。但是当我尝试向用户显示 <input type="email"> 的两条不同消息时 ng-messages 指令表现得很奇怪：首先，当用户将字段留空时（然后 required 发生错误），其次，当格式为错误（然后 email 错误发生） - 它显示 required 和 mail 消息，但我的旧代码只显示一条消息 - 关于 required 错误 - 这就是我认为欢迎行为。这是简化的代码：

<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>

您可以在这个 Plunker 中找到新旧代码的比较：Ng-if vs ng-messages at plnkr.co，以重现 ng-message 在邮件输入的内部和外部单击的奇怪行为。如果是 ng-if 形式，您将看到一条消息，如果是 ng-message 形式，您将看到两条消息。从 ng-if 迁移到 ng-messages 时我错过了什么吗？提前感谢您的帮助。

Answer 1

一切都很好，但是您没有将 angular-messages 库添加到您的项目中...

将它的文件添加到您的项目中并将 ngMessages 注入到您的 angularjs 模块中，然后您就可以开始了...

here is update plunker

AngularJS：输入类型为 "email" 的 ngMessage 异常行为

AngularJS: ngMessage weird behavior with input with type "email"

html

javascript

validation

html-input

angularjs