Question

我试图在将表单传递给服务器之前验证输入，但它似乎没有检查输入字段，也没有报告错误。我的指令代码，用于创建自定义验证器：

`var QUERY_REGEXP = /[A-Z,a-z,0-9]{1,20}/;
 app.directive('q', function() {
 return {
require: 'ngModel',
link: function(scope, elm, attrs, ctrl) {
  ctrl.$validators.q = function(modelValue, viewValue) {
    if (ctrl.$isEmpty(modelValue)) {

      return true;
    }

    if (QUERY_REGEXP.test(viewValue)) {

      return true;
    }

    return false;
  };
  }
 };
});`

html相同：

    <div ng-controller="CreditsController">     
    <div style="padding-top:20px" >
    <form name='form' novalidate>
    <b>Enter Name:&nbsp;&nbsp;</b><input id="creditq" ng-model='query1' name='query1' type="text" q />
    <button id="Submit" ng-click='click()' ng-value='search' required>Search</button><br/><br/>
    <span ng-show="form.query1.$error.query1">The value is not valid!</span>
    </form>
    </div>

我无法弄清楚我错过了什么或做错了什么。任何帮助将不胜感激。

Answer 1

我在这里看到的问题很少：

regexp：/[A-Z,a-z,0-9]{1,20}/将匹配任何字符串，其中包含上下字母，数字和昏迷。 {1,20}在这里没有帮助，因为你没有指定它必须在整个字符串的开头和结尾之间拟合。我认为你的正则表达式应该是：/^[A-Za-z0-9]{1,20}$/
根据this

与exec（）（或与之结合使用）一样，在同一个全局正则表达式实例上多次调用的test（）将超过上一个匹配。

所以你有两个选择：在每次验证器调用时重新创建regexp，或在每次调用时将lastIndex属性重置为0。
您的验证工具名为q，所以

<span ng-show="form.query1.$error.query1">The value is not valid!</span>

永远不会显示，因为$error永远不会拥有query1属性。它将被命名为q作为验证者。

在AngularJS中验证表单的输入

1 个答案: