Collating all the http response inside a common function using $q in Angularjs

Question

I am trying to use the $q service inside my controller. I have multiple environment which I need to hit and collect the data and consolidate the data and then put inside the scope. I have the below code.

     var results=[];
     for(var environment in  $rootScope.envs){
       $http.get(callService.getDomainUrl()+'/'+$rootScope.envs[environment]+ '/hosts.json').success(function(data){
              results.push(data)
          })
      }

      $q.all(results).then(function(){
          console.log(results);
      })

However, I am not sure if this is the right approach and also I need to map the result into an object of the below type:

results:{
  env1: { // result data for env1},
  env2: { // result data for env2},
  env3: { // result data for env3},
}

How to resolve the promise and consolidate the data in the above format.

vp_arth · Accepted Answer · 2016-01-11 10:13:00Z

1

As an addition to @SlavaUtesinov answer.
You should not to create new promises with $q.defer, just use $http.get return.

You'll get something like this:

  $q.all(Object.keys($rootScope.envs).map(request)).then(function(res){
    var results = {};
    for (var env in res) {
      results[env] = res[env].data;
    }
    console.log(results);
  }, function(err){
    console.error(err);
  });

  function request(env) {
    return $http.get(callService.getDomainUrl()+'/'+$rootScope.envs[env]+ '/hosts.json');
  }

Anyway, $q.all combine array/hash of promises into a single promise.
So, you should collect promises before call it.

edited Jan 11, 2016 at 10:13

answered Jan 11, 2016 at 10:06

vp_arth

15k4 gold badges43 silver badges72 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

zilcuanu Over a year ago

The above code works absolutely fine. However, the results object contains all the response from four environments. I need to map the response of each envrionement against its name. How can we get this done in the format of response={[{env1: {env2-res object}}, {env2: {env2-res object}, {env3: {env3-res object}}]}

vp_arth Over a year ago

If you pass hash object with promises to $q.all original keys will be saved in the result. You should pass {'env1': request('env1'), env2: request('env2')} hash to achieve this.

Slava Utesinov · Accepted Answer · 2016-01-12 09:29:58Z

1

You should check this example(look at log). I simulate $http.get request by means of setTimeout function.

edited Jan 12, 2016 at 9:29

answered Jan 11, 2016 at 9:32

Slava Utesinov

13.5k2 gold badges22 silver badges26 bronze badges

7 Comments

zilcuanu Over a year ago

This is what i was looking for. If there is an error, what is the best way to handle the error condition for any of the environment?

zilcuanu Over a year ago

Also the results object now contains the data and not with the key mapped to the environment name. I want the output to be in { env1: {data1}, env2: {data2}, env3: {data3}, env4:{data4}}

Slava Utesinov Over a year ago

I correct my answer - shifted var prom = $q.defer();promises.push(prom);. And can you write what you fetch at your console: console.log(results);

Slava Utesinov Over a year ago

And I added code for error processing, please look at new code!

vp_arth Over a year ago

This is an antipattern. You can use $http.get promise w/o create new one.

|

Collectives™ on Stack Overflow

Collating all the http response inside a common function using $q in Angularjs

2 Answers 2

2 Comments

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related