AngularJS Resolve promisse before return

Question

Good afternoon,

I'm new to angularJS, so sorry if I ask a basic question ... but I have a problem:

I have a service (Service2) that takes a string from a configuration, and I have another service (Service1) that using this service2 to do some more operations and returns a URL(return of service2 + operations on service1)... However, in function initialize () it skips the execution of

Service2.getConfig().then(function (config) {
            baseUrl = config.endPointUrl;
        });

And goes straight to return. Getting incomplete the URL what I need... Would you have any suggestions on how to get it to return service1 only after doing everything from service2?

Here's the basic code I'm trying to do

Service 1

function Service1($resource, Service2) {

    var resourceUrl = "";
    var baseUrl = "";

    initialize();

    function initialize() {

        Service2.getConfig().then(function (config) {
            baseUrl = config.endPointUrl;
        });

        resourceUrl = baseUrl + "/event/history/period";

    }
    return $resource(resourceUrl, {}, {
        'query': { method: 'GET', isArray: true }
    });

}

Service2

function service2($resource, $log) {
    var configService = {};

    configService.getConfig = getConfigFromServer;

    return configService;

    function getConfigFromServer() {
        var eventDataResource = $resource('api/service-config');
        return eventDataResource.get().$promise;
    }
}

Possible duplicate of [How do I return the response from an asynchronous call?](https://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call) — Yury Tarabanko, Jul 14 '17 at 19:49

score 0 · Answer 1 · answered Jul 14 '17 at 19:55

0

You need to only return once you have the data. getConfig() appears to be an asynchronous call. So, moving your return to the .then callback is the easiest action:

function Service1($resource, Service2) {
    var resourceUrl = "";
    var baseUrl = "";

    Service2.getConfig().then(function (config) {
        baseUrl = config.endPointUrl;
        resourceUrl = baseUrl + "/event/history/period";
        return $resource(resourceUrl, {}, {
            'query': { method: 'GET', isArray: true }
        });
    });
}

For more info: Promises, .then()

answered Jul 14 '17 at 19:55

Nick

4,901
40
61

I try to do this, but got a error: Error: [$injector:undef] Provider 'Service1' must return a value from $get factory method. – JPNakajima Jul 17 '17 at 13:08
Can you use `async` and `await`? – Nick Jul 17 '17 at 19:47

score -1 · Accepted Answer · answered Jul 17 '17 at 18:57

Searching more and asking other peoples about this problem, I find the following solution using $http

function Service1(Service2, $http, $q) {

    var eventDataService = {};

    var endPointUrl = $q.defer();
    Service2.getConfig().then(function (config) {
        endPointUrl.resolve(config.endPointUrl);
    });

    eventDataService.getCount = getCount;
    return eventDataService;

    function getEndPointUrl() {
        return endPointUrl.promise;
    }

    function getCount(successCallback, failureCallback) {
        getEndPointUrl().then(function (endPointUrl) {
            var uri = endPointUrl + '/event/gunshotCount';
            $http.get(uri).then(function (data) {
                successCallback(data);
            }, function (error) {
                failureCallback(error);
            });
        })
            .catch(function (error) {
                $log.error("Error while getting REST endpoint Url. Error : " + error);
            });
    }
}

Thanks to everyone!!! and now I know a little more about promise :D

AngularJS Resolve promisse before return

2 Answers2