javascript - AngularJS:$parsers 与 $validators

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

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

最佳答案

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

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

基本上

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

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

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

关于javascript - AngularJS:$parsers 与 $validators,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31029756/

相关文章:

javascript - 将对象数组转换为单个对象

angularjs - 使用 AngularJs 指令进行内联注释

javascript - AngularJS从索引到详细页面的动态路由

angularjs - 使用 Angular UI Router 在另一个文件中定义 onEnter 和 onExit 回调

javascript - 使用 Windows Phone 8.1 和 JavaScript 拍摄照片

javascript - 输入设定值

javascript - 在 Twitter Bootstrap 中添加时间选择器

javascript - 我怎样才能在 Angular 中做到这一点?

javascript - 如何搜索 JSON 对象来查找特定的参数值?

javascript - 如何使 href 充当提交表单