AngularJS:$ parsers vs $ validators

时间:2015-06-24 14:46:26

标签: javascript angularjs

在AngularJS中,$ parsers和$ validators都可用于验证表单。我想知道使用$ parser和使用$ validator之间究竟有什么区别。

让我们看看下面的例子:

使用解析器进行验证

angular.module("myFormApp")
    .directive("containsWhiteSpace", containsWhiteSpace);

function containsWhiteSpace () {

    function hasWhiteSpace(s) {
        return s.indexOf(' ') >= 0;
    }

    return {
        require: "ngModel",
        link: function(scope, ele, attrs, ctrl){

            ctrl.$parsers.unshift(function(value) {
                if(value){
                    var isValid = !hasWhiteSpace(value);
                    ctrl.$setValidity('hasWhiteSpace', isValid);
                }

                return isValid ? value : undefined;
            });

        }
    }
}

使用验证器进行验证

angular.module("myFormApp")
    .directive("containsWhiteSpace", containsWhiteSpace);

function containsWhiteSpace () {

    function hasWhiteSpace(s) {
        return s.indexOf(' ') >= 0;
    }

    return {
        require: "ngModel",
        link: function(scope, ele, attrs, ctrl){
            ctrl.$validators.hasWhiteSpace = function(value){
                return !hasWhiteSpace(value);
            }
        }
    }
}

他们都做同样的事情,但是什么时候使用解析器是正确的,什么时候使用验证器是正确的?两者有什么好处?有什么区别?

1 个答案:

答案 0 :(得分:7)

$parsers在管道中运行,以转换输入值。如果他们无法解析输入,则可以返回undefined,表示解析错误。如果输入值无法解析,则不会运行验证程序。

$validators在解析器之后运行解析后的值。他们可以返回false来表示数据错误。

基本上

  • 使用解析器将字符串输入值强制转换为您需要/期望的数据类型。
  • 使用验证程序验证正确数据类型的值。

例如,考虑需要正数的模型。 $parsers可以在值上调用parseFloat$validators可以检查值是否为正值。

对于您提供的示例,我认为$validators更合适(也更清晰)。