名称为"ngMessages"的module，通过npm install angular-messages进行安装。在没有使用ngMessages之前，我们可能这样写验证：

 

     
    
          
      
Username is too short.
    
      
Username is too long.
    
      
Your username is required.
     

 

以上，列举了每种可能的验证失败，并且手工编写是否显示错误提示信息。

有了"ngMessages"这个module,大致这么写：

 

     
  
      
用户名最小长度5
  
      
用户名最大长度10
  
      
用户名必填
     

 

ngMessages为我们自动判断显示哪种错误。

使用ngMessages的几个关键点：

● npm install angular-messages

● 引用：angular-messages.js

● 依赖：angular.module('app',['ngMessages'])

 

这里有一个简单的Demo,文件结构：

node_modules/

app.js

emailmessages.html

index.html

 

安装如下：

npm install bootstrap

npm install angular

npm install angular-messages

 

==index.html

 

  
         
       
     
  
      
    
       用户名    
           
       
      
        
用户名最小长度5
      
        
用户名最大长度10
      
        
用户名必填
    
       
  
      
  
      
    
       邮箱    
           
       
      
        
    
       
  
      
  
      
    
       提交  
      
  
      
{
   {userForm.name.$error}}
  
      
{
   {userForm.email.$error}}
     

 

app.js

 

angular.module('app',['ngMessages'])    .controller('MainCtrl', MainCtrl);function MainCtrl(){}

 

emailmessages.html

 

把有关email的表单验证放在这里，通过<div ng-messages-include="emailmessages.html"></div>显示到页面某个位置上。

 

邮箱必填
邮箱长度太短
邮箱长度太长
邮箱无效