如何在AngularJS中进行模拟同步AJAX调用?

时间:2016-05-20 06:38:19

标签: javascript angularjs asynchronous race-condition

我的app.js中有这个脚本:

app.run(['$http', '$location', 'myAppConfig', function ($http, $location, myAppConfig) {

    if (myAppConfig.webAPIPath.main == '') {

        var getconfigDone = false;

        $http.get('fileHandler.ashx?action=getconfig')
        .then(function (result) {
            if (JSON.parse(result.data.Data).APIURL !== undefined && JSON.parse(result.data.Data).APIURL != '') {
                var apiURL = JSON.parse(result.data.Data).APIURL;

                if (apiURL.lastIndexOf('/') + 1 == apiURL.length) {
                    apiURL = apiURL.substring(0, apiURL.lastIndexOf('/'))
                }

                myAppConfig.webAPIPath.main = apiURL + "/";

                myAppConfig.webAPIPath.account = myAppConfig.webAPIPath.main + '/api/OnlineApplicationPortal/v1/Account/';

                myAppConfig.webAPIPath.dashboard = myAppConfig.webAPIPath.main + '/OnlineApplicationPortal/v1/Dashboard/';
            }
            else {
                $location.path('Action/Welcome/apiUrlError');
            }
            //debugger
            getconfigDone = true;

        }, function (response) { debugger }

        );

    }



}]);

此外,我有这个工厂对象,它使用app.js中的myAppConfig

(function () {

    angular
        .module('app.data')
        .factory('accountDS', ['$http', '$routeParams', 'myAppConfig', function ($http, $routeParams, myAppConfig) {
            var pathPrefix = myAppConfig.webAPIPath.account;

            var createAccount = function (account, email) {

                var OnlineApplicationPortalModel = {
                    Name: account.firstName,
                    Surname: account.lastName,
                    Email: email,
                    Password: account.password
                };

                return $http.post(pathPrefix + 'CreateAccount', OnlineApplicationPortalModel)
                    .then(function (response) {

                        return response;
                    });
            };

            var confirmEmail = function () {
                var data = {
                    guid: $routeParams.guid
                };

                return $http.post(pathPrefix + 'ConfirmEmail', data)
                    .then(function (response) {
                        return response;
                    });
            }

            return {
                createAccount: createAccount,
                confirmEmail: confirmEmail
            };

}]);

})();

服务对象需要使用在{app.js运行函数中的函数中解析的myAppConfig.webAPIPath.account。现在问题是浏览器有时会比返回AJAX调用更早到达服务代码,这是竞争条件。我知道在AngularJS中不可能进行同步AJAX调用。那我怎么解决这个问题呢?

1 个答案:

答案 0 :(得分:0)

如果我正确理解您,您希望myAppConfig.webAPIPath.account解析此值以便稍后在您的代码中使用它,但是在赋值之前并不总是调用为此变量提供值的ajax调用。我认为您可以使用https://docs.angularjs.org/api/ng/service/$q来解决您的问题。您在myAppConfig中的代码应该在函数内部,因此您可以在工厂内调用它并返回延迟对象,然后在设置.account变量时应调用accountDS factory中的代码。