Validation AngularJs验证指令不更新模型_Validation_Angularjs_Directive

Validation AngularJs验证指令不更新模型

validation angularjs

Validation AngularJs验证指令不更新模型,validation,angularjs,directive,Validation,Angularjs,Directive,我执行此指令是为了验证数字是否在以下范围内： app.directive('nkNumber', function(){ return { scope: { max: '=nkMax', min: '=nkMin' }, require: 'ngModel', restrict: 'A', link: function($scope, iElm, iAttrs, controller) { function va

我执行此指令是为了验证数字是否在以下范围内：

app.directive('nkNumber', function(){
  return {
    scope: {
      max: '=nkMax',
      min: '=nkMin'
    }, 
    require: 'ngModel', 
    restrict: 'A',
    link: function($scope, iElm, iAttrs, controller) {
      function validate(value){
        if (angular.isDefined(value)){
          value = parseInt(value);
          if ($scope.max){
            var max = parseInt($scope.max);
            controller.$setValidity('nkMax', value < max)
          }
          if ($scope.min){
            var min = parseInt($scope.min);
            controller.$setValidity('nkMin', value > min)
          }
        }
        return value;
      }
      controller.$parsers.push(validate);
      controller.$formatters.push(validate);
    }
  };
});

验证工作正常，但当我更改输入上的值时，我的模型不会更新

为什么会这样？如何解决此问题？

您可能正在使用angular 1.2.x之前的版本。旧版本的angular处理的隔离作用域不一致，经常将其他指令吞并到隔离作用域中。这就是你的情况

ng模型作用于nk number指令的隔离作用域，因此它将其值写入这个私有作用域而不是外部作用域

如果您使用的是angular的1.2.x版本，那么隔离作用域不会像这样混合，因此应该按照预期工作

如果您希望保留在angular的旧版本中，则修复方法是根本不为此特定指令使用隔离作用域

通常，除非指令有模板，否则使用隔离作用域几乎总是一个坏主意。如果您的指令没有自己的模板，那么使用隔离作用域几乎是不合理的，并且可能会导致您所看到的那种问题

以下是一个没有隔离范围的指令示例：

app.directive('nkNumber', function($parse){
  return {
    require: 'ngModel', 
    restrict: 'A',
    link: function($scope, iElm, iAttrs, controller) {

      function validate(value){
        var max = $scope.$eval(iAttrs.nkMax);
        var min =  $scope.$eval(iAttrs.nkMin);

        if (angular.isDefined(value)){
          value = parseInt(value);
          if (max){
            max = parseInt(max);
            controller.$setValidity('nkMax', value < max)
          }
          if ($scope.min){
            min = parseInt(min);
            controller.$setValidity('nkMin', value > min)
          }
        }
        return value;
      }
      controller.$parsers.push(validate);
      controller.$formatters.push(validate);
    }
  };
});

请注意，如果没有隔离作用域，则需要在nkMax和nkMin属性上使用$scope.$eval

这实际上是编写此指令的更好方法，并且将适用于angular的所有版本。