Making Sync calls using promises Angular JS factories

Question

I am trying to make sync calls using a factory pattern.

$scope.doLogin = function (username, password, rememberme) {
        appKeyService.makeCall().then(function (data) {
//            data = JSON.stringify(data);
            debugAlert("login controller app key service"+data);
            var appkeyvalue = data.d.appkey;
            sessionConfigurationService.setBasicToken(appkeyvalue);

            loginService.makeCall(username, password, rememberme).then(function (accessTokenData) {
                if (accessTokenData.access_token !== "")
                {
                    sessionConfigurationService.setAccessTokenData(accessTokenData.access_token);
                    userPreferencesService.makeCall().then(function (userPreferencesData) {
                        if (userPreferencesData.d.userId !== "")
                        { 
                            sessionConfigurationService.setUserPreferences(userPreferencesData.d);
//                            $window.location.href = '/base.html';
                        }
                    });
                }
            });
        });
    };

My appKeyService factory is

app.factory('appKeyService', function ($q, authenticatedServiceFactory, configurationService) {
    var deffered = $q.defer();
    var service = {};

    service.makeCall = function () {
        debugAlert("appKeyService async method request start");
         authenticatedServiceFactory.makeCall("GET", configurationService.getAppKeyURL(), "", "").then(function (data) {
            debugAlert("appKeyService async method response")
            deffered.resolve(data);
        });
        return deffered.promise;
    };
    return service;
});

My authenticated service factory is

app.factory('authenticatedServiceFactory', function ($http, $q, sessionConfigurationService) {
    var deffered = $q.defer();
    var service = {};
    service.makeCall = function (methodType, URL, data, authType) {

        var headerValue = "";
        if (authType === "Basic") {
            headerValue = sessionConfigurationService.getBasicToken();
        } else if (authType === "Bearer") {
            headerValue = sessionConfigurationService.getBearerToken();
        }

        var config = {headers: {
                'Authorization': headerValue,
                'Accept': 'application/json;odata=verbose',
            },
            withCredentials: true,
            async: false
        };
        if (methodType === "GET") {
            $http.get(URL, data, config)
                    .then(function (getData) {
                        debugAlert("GET method response" + JSON.stringify(getData));
                        deffered.resolve(getData.data);
                    }, function (error) {
                        debugAlert("GET method response error" + JSON.stringify(error));
                        deffered.reject(error);
                    });
        }
        else if (methodType === "POST") {
            $http.post(URL, data, config)
                    .then(function (putData) {
                        debugAlert("POST method response" + JSON.stringify(putData));
                        deffered.resolve(putData.data);
                    }, function (error) {
                        debugAlert("POST method response error" + JSON.stringify(error));
                        deffered.reject(error);
                    });
        }
        else if (methodType === "DELETE") {
            $http.delete(URL, data, config)
                    .then(function (deleteData) {
                        debugAlert("DELETE method response" + JSON.stringify(deleteData));
                        deffered.resolve(deleteData.data);
                    }, function (error) {
                        debugAlert("DELETE method response error" + JSON.stringify(error));
                        deffered.reject(error);
                    });
        }
        else if (methodType === "PUT") {
            $http.put(URL, config)
                    .then(function (putData) {
                        debugAlert("PUT method response" + JSON.stringify(putData));
                        deffered.resolve(putData.data);
                    }, function (error) {
                        debugAlert("PUT method response error" + JSON.stringify(error));
                        deffered.reject(error);
                    });
        }
        return deffered.promise;
    };
    return service;
});

But I don't see the service calls are made in sync. So the "then" part in the controller is not executing after we receive the response. Its executing one after the other. How can I make that happen.

For the beginning, you should put var deffered = $q.defer(); in the service.makeCall functions — Frane Poljak, Mar 28 '16 at 14:36
Promises don't make your code synchronous. They just help (a lot) with writing asynchronous code. — Bergi, Mar 28 '16 at 15:18
Avoid the [deferred antipattern](http://stackoverflow.com/q/23803743/1048572)! You should not need a single `$q.defer();` in this code. — Bergi, Mar 28 '16 at 15:19

score 0 · Answer 1 · answered Mar 28 '16 at 15:44

@Frane Poljak

Thank you for your comment. I just brought

var deffered = $q.defer();

inside the makeCall method and its working as I wanted now. Thank you!

app.factory('appKeyService', function ($q, authenticatedServiceFactory, configurationService) {
    var service = {};

    service.makeCall = function () {
    var deffered = $q.defer();

        debugAlert("appKeyService async method request start");
         authenticatedServiceFactory.makeCall("GET", configurationService.getAppKeyURL(), "", "").then(function (data) {
            debugAlert("appKeyService async method response")
            deffered.resolve(data);
        });
        return deffered.promise;
    };
    return service;
});

Making Sync calls using promises Angular JS factories

1 Answers1