以ng-minlength为单位的动态值

jvi*_*tti 8 angularjs angularjs-directive

我有一个Config包含task.minlength = 3属性的常量调用.

我在下面添加常量$rootScope:

.run(function($rootScope, Config) {
  $rootScope.Config = Config;
})
Run Code Online (Sandbox Code Playgroud)

在模板中,我想将Config.task.minlength值设置为输入的ng-minlength指令:

<input type="text" ng-model="newTask" placeholder="Write a new task..." required ng-minlength="{{ Config.task.minlength }}">
Run Code Online (Sandbox Code Playgroud)

哪个根据DevTools正确解析:

在此输入图像描述

但是,验证不会被触发:

$scope.form.$error['minlength'] // undefined
Run Code Online (Sandbox Code Playgroud)

当我写3而不是插值时,它工作正常Config.task.minlength.

价值是否ng-minlength必须硬编码?有没有解决方法?

Ila*_*mer 8

ngModelController不要以任何方式$ observe$ evalngMinlength,因此它只获取静态整数值.

我创建了自己的使用指令$observe,这是一个例子:

app.directive('myMinlength',function(){
  return {
    require: 'ngModel',
    link: function(scope,elm,attr,ngModel){

      var minlength = 0;

      var minLengthValidator = function(value){     
        var validity = ngModel.$isEmpty(value) || value.length >= minlength;
        ngModel.$setValidity('minlength',  validity);
        return validity ? value : undefined;
      };

      attr.$observe('myMinlength', function(val){
         minlength = parseInt(val,10);
         minLengthValidator(ngModel.$viewValue);
      });


      ngModel.$parsers.push(minLengthValidator);
      ngModel.$formatters.push(minLengthValidator);
    } 
  };
});
Run Code Online (Sandbox Code Playgroud)

像这样使用它:

<input type="text" name="something" my-minlength="{{config.min}}" ng-model="something">
Run Code Online (Sandbox Code Playgroud)