AngularJS 表单验证 - 类型错误:无法设置未定义的属性“整数”

AngularJS Form validation - TypeError : Cannot set property 'integer' of undefined

本文关键字:未定义 设置 属性 整数 验证 表单 类型 错误 AngularJS      更新时间:2023-09-26

我遵循了本教程(自定义验证),当我使用 AngularJS 自定义验证加载我的 html 表单时出现此错误。我正在使用一个名为"整数"的指令来验证我在表单中的数字输入。

我不知道为什么我会收到此错误,因为我在整数之前有另一个人格指令(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>

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

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