AngularJS表单验证-TypeError：无法设置未定义的属性“整数”

Question

我遵循了tutorial（自定义验证），当我使用 AngularJS 自定义验证加载我的 html 表单时出现此错误。我正在使用一个名为“整数”的指令来验证我在表单中输入的数字。

我不知道为什么会出现此错误，因为我在整数 1 之前有另一个个人指令（excel 单元格验证），我没有收到错误。

这是我输入的号码：

<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 文件：

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>

Answer 1

升级到最新版本的 AngularJS：formController.$validators 是 Angular 1.3 中的新版本

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