Question

我创建了一个自定义输入控件，并尝试对模糊执行某些验证。但它没有达到预期的效果。我想使用像下面这样的模板而不是使用jquery特定的element.bind（＆＃39;模糊＆＃39;）

 template: '<input type="text" ng-blur="performvalidation()">',

Complete fiddle here

请指导或纠正我做错了什么。感谢。

Answer 1

如果要创建自定义验证器，则应将它们添加到ngModelController的$ validators字段中。 e.g。

angular.module('app').directive('strongSecret', function() {
  return {
    restrict: 'A',
    require: 'ngModel',
    link: function(scope, element, attr, ctrl) {
      ctrl.$validators.uppercaseValidator = function(value) {
        return /[A-Z]/.test(value);
      }

      ctrl.$validators.numberValidator = function(value) {
        return /[0-9]/.test(value);
      }

      ctrl.$validators.sixCharactersValidator = function(value) {
        return value.length === 6;
      }
    }
  };
});

而不是给你的指令一个模板，你应该只在输入元素上使用它

<input ng-model="strongSecret" strong-secret name="strongSecret"/>

如果您不希望在用户点击输入字段之前显示错误，则可以执行此操作

<ul ng-if="sampleForm.strongSecret.$touched" class="error-msgs" ng-messages="sampleForm.strongSecret.$error">
...
</ul>

工作jsFiddle：https://jsfiddle.net/e81kee9z/2/

AngularJS自定义输入控件不执行验证

1 个答案: