angularjs的ngMessages

在验证表单填入数据时，如果数据有错或无效会显示提示信息，在用angular写表单时，提示信息可以用ng-show在触发情况是显示，为了减少重复标记，可以利用ngMessages指令。
angular-messages是angular的一个模块，可以作为应用程序依赖模块引入：

angular.module("MyApp",["ngMessages"])；

<form name="signup_form" novalidate ng-submit="signupForm()" ng-controller="signupController">
    <label>Your name</label>
    <input type="text"
            placeholder="Name"
            name="name"
            ng-model="signup.name"
            ng-minlength=3
            ng-maxlength=20 required/>
    <div class="error" ng-messages="signup_form.name.$error">
        <div ng-message="required">Make sure you enter your name</div>
        <div ng-message="minlength">Your name must be least 3 characters</div>
        <div ng-message="maxlength">Your name cannot be longer than 20 characters</div>
    </div>
    <button type="submit">Submit</button>
</form>

这样如果填入表单数据有误，就会出现提示，一次只会出现一个消息，而且出现的顺序就是代码中的顺序，如果需要同时显示所有错误，就需要在ng-messages指令旁加上ng-messages-mutiple
或者很多时候视图中多个地方需要调用相同的提示消息，这时可以将消息保存到模板中，如下：

• 方法1：

<！--In template/error.html-->
<div ng-message="required">This field is required</div>
<div ng-message="minlength">The field must be at least 3 characters</div>
<div ng-message="maxlength">The field cannot be longer than 20 characters</div>

• 方法2

<!-- a generic template of error messages known as "my-custom-messages" -->
<script type="text/ng-template" id="my-custom-messages">
  <div ng-message="required">This field is required</div>
  <div ng-message="minlength">This field is too short</div>
</script>

然后在视图中使用ng-messages-include引入此模板地址或id：

<div class="error" ng-messages="signup_form.name.$error" ng-messages-include="template/error.html">
<!--如果有需要覆盖的可以在此重写单独覆盖-->
</div>

<div class="error" ng-messages="signup_form.name.$error" ng-messages-include="my-custom-messages">
<!--如果有需要覆盖的可以在此重写单独覆盖-->
</div>

还有另一种为自定义验证创建自定义消息，通过修改模型的$parsers链做到….目前还未深入了解