Question

我正在尝试使用我自己的指令验证表单上的数据，但只有在用户输入绑定之后才能验证数据。

myApp.directive('dvCyrillic', function() {
  return {
    require: 'ngModel',
    link: function(scope, elm, attrs, ctrl) {
      ctrl.$parsers.unshift(function(viewValue) {
        var CYRILLIC_REGEX = /^[а-яё -]+$/i;
        if (CYRILLIC_REGEX.test(viewValue) || viewValue.length == 0) {
          // it is valid
          ctrl.$setValidity('cyrillic', true);
          return viewValue;
        } else {
          // it is invalid, return undefined (no model update)
          ctrl.$setValidity('cyrillic', false);
          return undefined;
        }
      });
    }
  };
});

这是example。如何在用户输入smth之前验证数据？

Answer 1

$parsers只会从视图验证到模型，而$formatters将从模型验证到视图。您可以使用单独的方法重构验证，并将验证添加到解析器和格式化程序中：

var CYRILLIC_REGEX = /^[а-яё -]+$/i;
ctrl.$parsers.unshift(validate);
ctrl.$formatters.unshift(validate);

function validate(viewValue) {
  if (CYRILLIC_REGEX.test(viewValue) || viewValue.length == 0) {
    // it is valid
    ctrl.$setValidity('cyrillic', true);
    return viewValue;
  } else {
    // it is invalid, return undefined (no model update)
    ctrl.$setValidity('cyrillic', false);
    return undefined;
  }
}

这是updated fiddle

在用户输入smth之前使用custom指令进行数据验证

1 个答案: