Question

我有两个HTML输入（type="email"，type="number"），我的Angular应用使用$formatters和$parsers观看它们。错误存储在一个数组中，当用户插入包含＆＃34; @ gmail＆＃34;错误从数组中删除。

app.controller('form1Controller', function($scope, UserService) {
    $scope.formCompleted = false;
    $scope.errors = UserService.errors;

     //handle the user email input.
    $scope.storeEmailErr = function(data) {

        var correctKey = "@gmail";
        var key = "#userEmail"; 

        var res = {}; 

        if (data != null) {
            res = $scope.handleError(data, emailIn, correctKey, key, $scope.errors);
            $scope.errors = res[0];
            UserService.errors = res[0];
            emailIn = res[1];
        }
    };

    //handle the user email input.
    $scope.storeIdErr = function(data) {

        var correctKey = "0000";
        var key = "#userId";

        var res = {};

        if (data != null) {
            res = $scope.handleError(data, idIn, correctKey, key, $scope.errors);
            $scope.errors = res[0];
            idIn = res[1];
        }

     };
}

这是添加和删除数组错误的代码。在这里我想是问题

function theIndexOf(val) {
  console.log("find index in array of length:  " + errorsDescription.length)
  for (var i = 0; i < errorsDescription.length; i++) {
    if (errorsDescription[i].selector === val) {
        return i;
    }
  }
}

app.run(function($rootScope){
$rootScope.handleError = function(data, elemIn, correctKey, key, errorArray){
    var idx = theIndexOf(key);
    console.log("get index >>>>> " + idx);
    var obj = errorsDescription[idx];

    //if user didn't put correct word i.e. @gmail or 0000
    if (data.indexOf(correctKey) < 0) {
        if (!elemIn) {
            errorArray.push(obj);
            elemIn = true;
        }
    } else {
        if (elemIn) {
            $.each(errorArray, function(i){
                if(errorArray[i].selector === key) {
                    errorArray.splice(i, 1);
                    elemIn = false;
                }
            });
        }
    }
    return [errorArray, elemIn];
}
});

问题是，当我插入ie＆＃34; test@gmail.com"时，错误会从数组中删除，当我再次插入正确的数据时，它会告诉我无法读取＆＃39; yyy＆＃ 39;未定义的属性。

这是我的傻瓜。 https://plnkr.co/edit/l0ct4gAh6v10i47XxcmT?p=preview

在plunker中，输入字段＆＃39; test @ gmail＆＃39;和Number0000的数字，然后删除数据，然后再次插入相同的数据，以查看问题

非常感谢任何帮助！

Answer 1

您遇到的问题是这个代码块：

$.each(errorArray, function(i){
    if(errorArray[i].selector === key) {
        errorArray.splice(i, 1);
        elemIn = false;
     }
});

当您调用splice时，您正在修改数组的长度。 $.each循环遍历数组的长度，并且不知道长度更改。（我不知道$.each的内部工作原理，但我猜测它会在启动前缓存数组的长度，这是出于性能原因。）所以，在你拼出第一个错误后，循环仍然是第二次跑。此时，errorArray[1]不再存在，这会导致您的未定义错误。

请参阅此问题以供参考：Remove items from array with splice in for loop

Answer 2

编辑：在这里工作：https://plnkr.co/edit/8DY0Cd5Pvt6TPVYHbFA4

问题在于：

var obj = errorsDescription[idx];

//if user didn't put correct word i.e. @gmail or 0000
if(data.indexOf(correctKey) < 0){
    // console.log("You must put correct word");
    if(!elemIn){
        errorArray.push(obj);
        elemIn = true;
    }
}

当您的个人编号错误被删除时，上面的逻辑会将undefined推送到您的errorArray（因为elemIn为false）。你的storeIdErr methond：

$scope.storeIdErr = function(data){

    var correctKey = "0000";
    var key = "#userId";

    var res = {};

    if(data != null){
        res = $scope.handleError(data, idIn, correctKey, key, $scope.errors);
        $scope.errors = res[0];
        idIn = res[1];
    }

};

读取此值（res [0]）并将其存储在$ scope.errors中，最终在下一个输入事件中迭代：

function theIndexOf(val){
    console.log("find index in array of length:  " + errorsDescription.length)
    for(var i = 0; i < errorsDescription.length; i++){
        if(errorsDescription[i].selector === val){
            return i;
        }
    }
}

由于您的工厂在询问错误时返回该对象。要解决此问题，您应该保留一个永远不会从中删除的静态列表，从而提供错误定义。这是您在第一个代码块中推送到errorArray时应该引用的内容。

无法阅读xyxyx＆＃39;即使元素存在，也未定义属性

2 个答案: