AngularJS : chaining http promises $q in a service

Betty St picture Betty St · May 8, 2013 · Viewed 9.8k times · Source

i have problems when it comes to $http promises in angularjs. i am doing this in my service: (the getSomething function should chain two promises)

the second function uses a external callback function!

app.service('blubb', function($http, $q) {

  var self = this;

  this.getSomething = function(uri, data) {
    return self.getData(uri).then(function(data2) {
      return self.compactData(uri, data2);
    });
  };

  this.getData = function(uri) {
    var deferred = $q.defer();
    $http.get(uri).success(function(data) {
      deferred.resolve(data);
    }).error(function() {
      deferred.reject();
    });

    return deferred.promise;
  };

  this.compactData = function(uri, data) {
    var deferred = $q.defer();
    /* callback function */
      if(!err) {
        console.log(compacted);
        deferred.resolve(compacted);
      } else {
        console.log(err);
        deferred.reject(err);
      }
    /* end of function */

    return deferred.promise;
  };
});

when i use the service in my controller it doesn't output the console.log:

blubb.getSomething(uri, input).then(function(data) {
  console.log(data)
});

edit: if i define the callback function by myself in 'compactData' it works, but i am using "jsonld.compact" from https://raw.github.com/digitalbazaar/jsonld.js/master/js/jsonld.js and THIS doesn't work!

    jsonld.compact(input, context, function(err, compacted) {
      if(!err) {
        console.log(compacted);
        deferred.resolve(compacted);
      } else {
        deferred.reject('JSON-LD compacting');
      }
    });

i am getting the console.log output in jsonld.compact but the resolve doesn't work and i don't know why..

it only works with $rootScope.$apply(deferred.resolve(compacted));

Answer

Thiago Pereira picture Thiago Pereira · Aug 15, 2014

I'm using chaining promises like this:

            $http.get('urlToGo')
                .then(function(result1) {
                    console.log(result1.data);
                    return $http.get('urlToGo');
                }).then(function(result2) {
                    console.log(result2.data);
                    return $http.get('urlToGo');
                }).then(function(result3) {
                    console.log(result3.data);
                });