AngularJS表单验证 - 类型错误：无法设置undefined的属性'integer'

我跟着这个tutorial（自定义验证），并且当我使用AngularJS自定义验证加载我的html表单时出现此错误。我正在使用一个叫做'integer'的指令来验证我的表单中的数字输入。AngularJS表单验证 - 类型错误：无法设置undefined的属性'integer'

我不知道为什么我得到这个错误，因为我在整数之前有另一个personnal指令（excel cell validation），并且没有错误。

这里是我的电话号码输入：

<input type="number" ng-model="param.lineAct" class="form-control" min="0" integer />

我的指令：

var INTEGER_REGEXP = /^-?\d+$/; 
adcAppDirectives.directive('integer', function() { 
    return { 
     require: 'ngModel', 
     link : function (scope, elm, attrs, ctrl) { 
      ctrl.$validators.integer = function (modelValue, viewValue){ 
       if (ctrl.$isEmpty(modelValue)) { return false}; 
       if (INTEGER_REGEXP.test(viewValue)) {return true}; 
       return false; 
      }; 
     } 
    }; 
});

这是错误的样子：

TypeError: Cannot set prpoerty 'integer' of undifined at link 127.0.0.1/Symfony/web/app_dev.php/js/…) input <type="number" ng-model="param.lineAct" class="form-control ng-pristine ng-valid" min="0" integer="">

编辑：这里是整个指令的javascript file：

var adcAppDirectives = angular.module('adcAppDirectives', []); 

var INTEGER_REGEXP = /^\-?\d+$/; 
var EXCELCEL_REGEXP = /^[A-Z]+[0-9]+/; 
var EXCELCELS_REGEXP = /^[A-Z]+[0-9]+:[A-Z]+[0-9]+/; 
var EXCELCOL_REGEXP = /^[A-Z]+/; 

adcAppDirectives.directive('integer', function() 
{ 
    return { 
     require: 'ngModel', 
     link: function(scope, elm, attrs, ctrl) { 
      ctrl.$validators.integer = function (modelValue, viewValue) { 
       if (ctrl.$isEmpty(modelValue)){ 
        return false; 
       } 
       if (INTEGER_REGEXP.test(viewValue)) { 
        return true; 
       } 
       return false; 
      } 
     } 
    }; 
}); 

adcAppDirectives.directive('excel-cel', function() 
{ 
    return { 
     require: 'ngModel', 
     link: function(scope, elm, attrs, ctrl) { 
      ctrl.$validators.excel_cel = function (modelValue, viewValue) { 
       if (ctrl.$isEmpty(modelValue)){ 
        return false; 
       } 
       if (EXCELCEL_REGEXP.test(viewValue)) { 
        return true; 
       } 
       return false; 
      }; 
     } 
    }; 
}); 

adcAppDirectives.directive('excel-cels', function() 
{ 
    return { 
     require: 'ngModel', 
     link: function(scope, elm, attrs, ctrl) { 
      ctrl.$validators.excel_cels = function (modelValue, viewValue) { 
       if (ctrl.$isEmpty(modelValue)){ 
        return false; 
       } 
       if (EXCELCELS_REGEXP.test(viewValue)) { 
        return true; 
       } 
       return false; 
      }; 
     } 
    }; 
}); 

adcAppDirectives.directive('excel-col', function() 
{ 
    return { 
     require: 'ngModel', 
     link: function(scope, elm, attrs, ctrl) { 
      ctrl.$validators.excel_col = function (modelValue, viewValue) { 
       if (ctrl.$isEmpty(modelValue)){ 
        return false; 
       } 
       if (EXCELCOL_REGEXP.test(viewValue)) { 
        return true; 
       } 
       return false; 
      }; 
     } 
    }; 
});

和HTML：

<form name="form" novalidate class="simple-form"> 
          <div class="form-group"> 
           <div class="col-lg-6"> 
            Nom: <input type="text" ng-model="param.Name" class="form-control" /> 
           </div> 
          </div> 
          <div class="form-group"> 
           <div class="col-lg-6"> 
            Plage de paramètres: <input type="text" ng-model="param.paramTitle" class="form-control" excel-cels /> 
           </div> 
          </div> 
          <div class="form-group"> 
           <div class="col-lg-6"> 
            Ligne des traitements: <input type="number" ng-model="param.lineAct" class="form-control" min="0" integer /> 
           </div> 
          </div> 
          <div class="form-group"> 
           <div class="col-lg-6"> 
            Colonne de la DIR: <input type="text" ng-model="param.dirCol" class="form-control" excel-col /> 
           </div> 
          </div> 
          <div class="form-group"> 
           <button type="button" class="btn btn-success col-lg-offset-6 col-lg-2">Valider</button> 
          </div> 
          </form>

来源

2014-12-30 Tristan Djahel

请问您还可以添加错误吗？我的意思是复制粘贴。 –

TypeError：无法设置链接处未定义的prpoerty'integer'http://127.0.0.1/Symfony/web/app_dev.php/js/71229cb_Directives_9.js:13:32）input –

您是否已将整数指令注入控制器？ – simeg

升级到AngularJS的最新版本：formController.$validators在角1.3

是新的。如果你不能，请参阅您的文档。这里是1.2的表单指南：https://code.angularjs.org/1.2.28/docs/guide/forms

来源

2014-12-30 10:19:37 blint

1.2.28您是对的。我正在更改代码。 –

我没有错误。谢谢！ –

我很高兴你不错，玩得开心;-) – blint

AngularJS表单验证 - 类型错误：无法设置undefined的属性'integer'

回答

相关问题