$rootScope:angularjs 1.4.0 中的 infdig 错误

Question

我有以下标记，其形式与一些 asp.net 剃刀混合：

<div class="account-form__field-container" ng-show="postcodeRequired()" ng-cloak>
    @Html.LabelFor(x => x.Postcode)
    @Html.TextBoxFor(x => x.Postcode, new { @class = "account-form__field", placeholder = "Postcode here...", ng_required = "postcodeRequired()",ng_validpostcode="", ng_model = "postcode", ng_init = "postcode = '" + Model.Postcode + "'" })
    @Html.ValidationMessageFor(x => x.Postcode, null, new { @class = "account-form__error-message" })
    <span class="account-form__error-message" ng-show="registrationForm.$submitted && registrationForm.Postcode.$error.required" ng-cloak>
        Please enter your postcode
    </span>
    <span class="account-form__error-message" ng-show="registrationForm.$submitted && !validPostCode()" ng-cloak>
        Please enter valid postcode
    </span>
</div>

我有一个下拉列表，将显示隐藏邮政编码字段，因此如果选择了英国，则会显示邮政编码字段。 该字段是必填字段，但此外，我正在通过网络服务检查是否是有效的邮政编码。 处理表单提交的角度控制器如下所示：

        $scope.submitForm = function () {
        $scope.registrationForm.$submitted = true;
        if ($scope.enableSubmit()) {
            registrationForm.submit();
        }
    };
    $scope.postcodeRequired = function () {
        return $scope.country === 'United Kingdom';
    };
    $scope.validPostCode = function () {
        if ($scope.postcodeRequired()) {
            if ($scope.postcode !== undefined && $scope.postcode.length > 5) {
                postcodeService.ValidatePostCode($scope.postcode).success(function (response) {
                    return response;
                });
            } else {
                return false;
            }
        }
        return true;
    };
     $scope.enableSubmit = function () {
        return $scope.registrationForm.$valid
            && $scope.passwordsMatch()
            && $scope.acceptTerms
            && $scope.validPostCode();
    };

邮政编码服务只是执行 http get 来验证返回 true 或 false 的 post 代码。 我遇到的问题是提交它会验证邮政编码，但随后进入循环并给出以下错误：

angular.min.js:34 Uncaught Error: [$rootScope:infdig] http://errors.angularjs.org/1.4.0/$rootScope/infdig?p0=10&p1=%5B%5D
at angular.min.js:34
at m.$digest (angular.min.js:563)
at m.$apply (angular.min.js:571)
at l (angular.min.js:373)
at O (angular.min.js:388)
at XMLHttpRequest.N.onload (angular.min.js:392)

我在进行ng重复时看到其他人遇到此问题，但如您所见，我没有这样做。

有什么想法吗？

Answer 1

如果没有一个 plunkr 来测试和验证，很难准确判断是什么导致了无限摘要循环循环。 但是，我相信这可能是由于对您的$scope.validPostCode函数进行的调用量(未正确返回其有效性(引起的。 基本上，建议的更改是仅在邮政编码已更改(由字段上的ng-change触发(时才调用验证函数。 该函数的结果$scope.validPostCode变量设置为 true 或 false，然后检查其有效性;

HTML (将ng-change添加到输入(

@Html.TextBoxFor(x => x.Postcode, new { <!-- other attributes -->, ng_change = "validatePostCode()" })

JavaScript

$scope.postcodeRequired = function () {
    return $scope.country === 'United Kingdom';
};
// by default its not valid
$scope.validPostCode = false;
// our Validition check
$scope.validatePostCode = function () {
    if ($scope.postcodeRequired()) {
        if ($scope.postcode !== undefined && $scope.postcode.length > 5) {
            postcodeService.ValidatePostCode($scope.postcode).success(function (response) {
                $scope.validPostCode = response;
            });
        } else {
            $scope.validPostCode = false;
        }
    } else {
        $scope.validPostCode = true;
    }
};
// call our function to properly set the initial validity state.
$scope.validatePostCode();
$scope.enableSubmit = function () {
    return $scope.registrationForm.$valid
        && $scope.passwordsMatch()
        && $scope.acceptTerms
        && $scope.validPostCode;
};