Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/453.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript AngularJS:$parser vs$validator_Javascript_Angularjs - Fatal编程技术网

Javascript AngularJS:$parser vs$validator

Javascript AngularJS:$parser vs$validator,javascript,angularjs,Javascript,Angularjs,在AngularJS中,$parser和$validator都可以用来验证表单。我想知道使用$parser和使用$validator到底有什么区别 让我们看一下以下示例: 使用解析器进行验证 angular.module("myFormApp") .directive("containsWhiteSpace", containsWhiteSpace); function containsWhiteSpace () { function hasWhiteSpace(s) {

在AngularJS中,$parser和$validator都可以用来验证表单。我想知道使用$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);
            }
        }
    }
}
使用验证器进行验证

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);
            }
        }
    }
}

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

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

$validator
在解析器之后,根据解析后的值运行。它们可以返回
false
以指示数据错误

基本上

  • 使用解析器将字符串输入值强制转换为所需/预期的数据类型
  • 使用验证器验证正确数据类型的值
例如,考虑一个需要正数的模型。code>$parsers可以对值调用
parseFloat
,而
$validator
可以检查值是否为正值


对于您给出的示例,我认为
$validators
更合适(更干净)。

$validators仅在1.3+中引入,而如果使用<1.2,则使用$parsers谢谢,很好的解释如果我想在清除字段时,将模型设置回
未定义的
,而不将我的解析器视为无效,该怎么办?我如何做到这一点?