$ rootScope: ошибка infdig в angularjs 1.4.0

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>

У меня есть выпадающий список, в котором будет отображаться скрытие поля почтового индекса, поэтому, если uk выбран, поле почтового индекса будет отображаться.Поле обязательно для заполнения, но я также проверяю, является ли действительный почтовый индекс через веб-сервис.Угловой контроллер, который имеет дело с отправкой формы, выглядит следующим образом:

        $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();
    };

PostCodeService просто выполняет http get для проверки почтового кода, который возвращает true или false.Проблема, которую я имею при отправке, проверяет почтовый индекс, но затем зацикливается и выдает следующую ошибку:

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-repeat, но, как вы можетевидите, я этим не занимаюсь.

Есть идеи?

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;
};