Question

我的表单上有一个特殊的开发人员按钮，所以每次我测试应用程序时都不必输入表单数据。假按钮调用函数fakeSubmit（）并预填充表单。

fakeSubmit只是将表单值local.code设置为'000000'并调用实际的submit（）函数：

scope.submit = function () {
    if (scope.requestTicketForm.$invalid) {
        scope.local.showErrorAlert = true;
    }
    else {
        // Send request
        myApi.getTicket(scope.local.code)
            .then(function (data) {
                scope.local.showErrorAlert = false;
            })
            .catch(function (error) {
                scope.local.showErrorAlert = true;
            });
    }
};

scope.fakeSubmit = function () {
    $log.info('enter fake request click');
    scope.local.code = '000000';
    scope.submit();
};

现在的问题是表单$invalid属性没有立即更新，因此submit函数将showErrorAlert设置为true而不是发送请求。我在调用submit（）之前尝试添加scope.$apply：

scope.fakeSubmit = function () {
    $log.info('enter fake request click');
    scope.local.code = '000000';
    scope.$apply();
    scope.submit();
};

这样可行，但会引发以下错误：

Error: [$rootScope:inprog] $apply already in progress

任何想法如何解决这个问题？

Answer 1

强制角度更新范围的另一种方法是调用$digest：

if(!$scope.$$phase) {
    $scope.$digest();
}

所以你的代码应该是：

scope.fakeSubmit = function () {
    $log.info('enter fake request click');
    scope.local.code = '000000';

    if(!scope.$$phase) {
        scope.$digest();
    }

    scope.submit();
};

AngularJS：如何以编程方式设置范围变量后立即更改表单状态

1 个答案: