AngularJS validation with messages

为什么80%的码农都做不了架构师？>>>   

    接着上次的AngularJS remote validation，在表单验证中，我们有各种规则，eg：required，minlength，maxlength这些是H5提供的属性，AngularJS提供了ng-pattern用于正则表达式，一个表单有N个验证规则，那么我们如何进行不同提示信息的展示呢。

    0如果只是一种验证规则，我们可以简单的实现：

<div ng-show="form.$invalid">validation message</div>

    1如果是多个验证规则，通过这种方式，我们拿不到具体未通过的验证规则，所以采用AngularJS提供的angular-    messagers，（当然，并不是说angular-messagers只有这一个应用场景）参考：AngularJS-ngMessages

0在加载模块时，添加：
    angular.module('angularJS', 
		['ngMessages']);

1信息提示代码：
<form name="myForm">
  <label>
    Enter your name:    <input type="text"
           name="myName"
           ng-model="name"
           ng-minlength="5"
           ng-maxlength="20"
           required />
  </label>
  <pre>myForm.myName.$error = {{ myForm.myName.$error | json }}</pre>

  <div ng-messages="myForm.myName.$error" style="color:maroon" role="alert">
    <div ng-message="required">You did not enter a field</div>
    <div ng-message="minlength">Your field is too short</div>
    <div ng-message="maxlength">Your field is too long</div>
  </div>
</form>

转载于:https://my.oschina.net/geek4j/blog/591408