AngularJS | ng-pattern指令

AngularJS中的ng-pattern指令用于在输入HTML元素上将模式(正则表达式)验证器添加到ngModel中。如果输入字段数据与通过评估ngpattern属性值中指定的Angular表达式而找到的RegExp不匹配，则用于设置模式验证错误键。

句法：

 Contents... 

示例1：本示例使用ng-pattern指令检查密码模式。

  

    ng-pattern Directive
      
    
     
      
    
        .red {
            color:red
        }
        .green {
            color:green
        }
    

  

      
    GeeksforGeeks
    ng-pattern Directive
  
    
        
            Password:
                  
            
                Not valid password.
            
              
            Confirm: 
              
            
                Password {{isconfirm==true?'':'not'}} match
            
        
    
      
    
        var app = angular.module("app", []);
        app.controller('geek', ['$scope', function ($scope) {
            $scope.re = /^[a-zA-Z]\w{3,14}$/;
              
            $scope.compare = function (repass) {
                $scope.isconfirm = $scope.password == repass ?
                        true : false;
            }
        }]);
    

  
                    

输出：

• 输入无效：
  
• 输入不匹配：
  
• 有效输入：
  

示例2：如果输入不是数字，则此示例显示错误。

  

    ng-pattern Directive
      
    
     

  

      
    GeeksforGeeks
    ng-pattern Directive
  
    
        
            Input Number: 
              
            
                Input is not valid.
            
        
    
      
    
        var app = angular.module("app", []);
          
        app.controller('geek', ['$scope', function ($scope) {
            $scope.re = /^[0-9]{1,6}$/;
        }]);
    

  
                    

输出：

• 输入为文字：
  
• 输入的是数字：