角度材料 ng 消息未正确显示

Question

我正在使用 angular-messages 在我的 Angular 应用程序上显示表单验证错误

演示

http://jsbin.com/sutahixima/edit?html,js,output

不幸的是，这三个消息一直在显示。无论我在输入字段中输入什么，它是否是一个有效的名称。两条消息始终显示。如果我尝试只包含一个 ng-message，结果是一样的。

知道我做错了什么吗？

Answer 1

好的，我设法解决了它

演示

http://jsbin.com/cubafoluji/1/edit?html,js,output

基本上我所做的是：

1. 添加脚本以加载 ngMessages（尝试在文档末尾为您的项目加载脚本，只是一个建议）：

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.11/angular-messages.js"></script>

1. 在messages 容器中你的ng-message 错误，你需要使用输入name，我也使用了ng-if，我认为它更可靠：

<div ng-messages="accountSignup.firstname.$error" ng-if="accountSignup.firstname.$dirty" role="alert">

1. 在js中，我将ngMessages加载为一个模块：

var module = angular.module('test', ['ngMaterial', 'ngMessages']);

我注意到您使用了 Angular Material，消息存在一个已知问题： https://github.com/angular/material/issues/2781

这是我的修复信息来源，我希望它对你有用。

PD：我将 html 中的 min、max 和 require 更改为 ng-min....避免任何意外行为。