限制HTML和AngularJs中的特殊字符

` ~ ! @ # $ %^& * () _ + = { } | [ ] \ : ' ; " < > ? , ./

我想在输入文本字段中限制上述特殊字符和数字。我用限制HTML和AngularJs中的特殊字符

ng-pattern="/^[a-zA-Z ]*$/"

来限制特殊字符。这种模式阻止了所有的特殊字符。当我想输入名称“PérezGil”时，我遇到了问题，我不想限制其他语言文本。

来源

2016-10-12 Warrior

更新：

我觉得$解析器是这里最好的选择。查看更新后的代码和抢劫者。

控制器

angular.module('ngPatternExample', []) 
    .controller('ExampleController', ['$scope', function($scope) { 
    $scope.regex = /^[^`[email protected]#$%\^&*()_+={}|[\]\\:';"<>?,./1-9]*$/; 
    }]) 
    .directive('myDirective', function() { 
    function link(scope, elem, attrs, ngModel) { 
      ngModel.$parsers.push(function(viewValue) { 
      var reg = /^[^`[email protected]#$%\^&*()_+={}|[\]\\:';"<>?,./1-9]*$/; 
      // if view values matches regexp, update model value 
      if (viewValue.match(reg)) { 
       return viewValue; 
      } 
      // keep the model value as it is 
      var transformedValue = ngModel.$modelValue; 
      ngModel.$setViewValue(transformedValue); 
      ngModel.$render(); 
      return transformedValue; 
      }); 
     } 

     return { 
      restrict: 'A', 
      require: 'ngModel', 
      link: link 
     };  
    });

模板

<input type="text" ng-model="model" id="input" name="input" my-directive />

这里有一个Plunker更新例如

https://plnkr.co/edit/eEOJLi?p=preview

旧答案：

既然你已经有了要限制字符的列表，你可以拼出来的，如NG模式表达：

控制器

angular.module('ngPatternExample', []) 
    .controller('ExampleController', ['$scope', function($scope) { 
     $scope.regex = /^[^`[email protected]#$%\^&*()_+={}|[\]\\:';"<>?,./1-9]*$/; 
    }]);

模板

<input type="text" ng-model="model" id="input" name="input" ng-pattern="regex" />

这里是一个关于Plunker的实例

https://plnkr.co/edit/eEOJLi?p=preview

来源

2016-10-12 19:07:22 Peng

@Warrior对不起，我没有正确理解这个要求。我更新了我的答案，并且为了适应您的需求而进行了调整。让我知道如果这对你有用 – Peng

<!DOCTYPE html> 
<html> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
<body ng-app="myApp"> 
<div ng-controller="myCtrl"> 

    <input type="text" ng-change="Check(myValue)" ng-model="myValue" /> 
    <p ng-show="test">The Special Character not accept.</p> 
</div> 

<script> 
    angular.module('myApp', []) 
    .controller('myCtrl', ['$scope', function($scope,ngModel) { 


     $scope.Check= function(x) { 
     var reg = /^[^`[email protected]#$%\^&*()_+={}|[\]\\:';"<>?,./]*$/; 

       if (!x.match(reg)) { 
       $scope.myValue = x.substring(0, x.length-1); 
       $scope.test=true; 

       } 
       else 
       { 
       $scope.test=false; 
       } 
     }; 
    }]); 
</script> 
</body> 
</html>

来源

2017-04-28 18:14:59 user7938076

请提供更多的解释给你的答案，为什么这应该帮助OP与他的问题？ – hassan

Use Directives to restrict Special characters: 

angular.module('scPatternExample', []) 
     .controller('scController', ['$scope', function($scope) { 
     }]) 
    .directive('restrictSpecialCharactersDirective', function() { 
     function link(scope, elem, attrs, ngModel) { 
       ngModel.$parsers.push(function(viewValue) { 
       var reg = /^[a-zA-Z0-9]*$/; 
       if (viewValue.match(reg)) { 
        return viewValue; 
       } 
       var transformedValue = ngModel.$modelValue; 
       ngModel.$setViewValue(transformedValue); 
       ngModel.$render(); 
       return transformedValue; 
       }); 
      } 

      return { 
       restrict: 'A', 
       require: 'ngModel', 
       link: link 
      };  
     }); 

In Html:  
    <input type="text" ng-model="coupon.code" restrict-Special-Characters-Directive>

来源

2017-10-26 12:06:56

你的回答确实显示，如何使用正则表达式，但问题清楚地表明正则表达式OP已经使用了不是OP要的值。所以只是复制和粘贴给定的正则表达式不是一个真正的*解决方案，请编辑您的答案，以满足要求**真的**回答这个问题！如果你不能想到除了你发布的解决方案，请考虑删除你的答案 - 上面的混乱。 – cramopy

限制HTML和AngularJs中的特殊字符

回答

相关问题