加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

为什么添加额外的AngularJS验证指令会导致$asyncValidators多次

发布时间:2020-12-17 07:48:47 所属栏目:安全 来源:网络整理
导读:为什么添加额外的AngularJS验证指令会导致$asyncValidators在页面加载时多次运行? 我创建了一个实现$asyncValidators的自定义指令.这是该自定义指令的基本结构: myApp.directive('userSaved',['$q','userLookup',function($q,userLookup){return { restric
为什么添加额外的AngularJS验证指令会导致$asyncValidators在页面加载时多次运行?

我创建了一个实现$asyncValidators的自定义指令.这是该自定义指令的基本结构:

myApp.directive('userSaved',['$q','userLookup',function($q,userLookup){
return {
  restrict: 'A',require: 'ngModel',link: function(scope,elem,attrs,ctrl){
    ctrl.$asyncValidators.userSaved = function(modelValue,viewValue) {
      // do stuff 
    }
  }
}
}]);

控制器初始化tailNumber模型值,如下所示:

$scope.tailNumber = 'N33221';

这是用户保存的指令在页面加载时运行3次的html:

<input ng-model="tailNumber" name="tailNumber"   user-saved 
    ng-minlength="2"   ng-pattern="/^[A-z][a-zA-Z0-9]*$/" >

当我删除ng-minlength =“2”时,用户保存的指令在页面加载时运行两次(2次).这是移除了ng-minlength =“2”的html:

<input ng-model="tailNumber" name="tailNumber"   user-saved 
    ng-pattern="/^[A-z][a-zA-Z0-9]*$/" >

当我删除ng-pattern =“/ ^ [A-z] [a-zA-Z0-9] * $/”时,用户保存的指令只运行一次.这是移除ng-pattern =“/ ^ [A-z] [a-zA-Z0-9] * $/”后的html

<input ng-model="tailNumber" name="tailNumber" user-saved >

为什么我的函数注册了$asyncValidators为附加到表单元素的每个额外的ng验证器运行额外的时间?

我的自定义指令是一个昂贵的$http调用,我更喜欢我的自定义指令只在页面加载时运行一次.是否可以使用所有这些ng验证器,而只运行我的异步验证器功能一次而不是页面加载3次?

这是因为像ngMaxlength,ngPattern这样的验证指令通过调用ngModelController来调用初始验证周期.$validate().

这会导致所有验证指令运行其验证逻辑,包括异步验证器.

一种防止冗余$http调用的方法,实际上无论如何都是一种好的做法,就是缓存每个输入的验证结果.

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读