How to make async calls in angularJS using $promise?

Question

I need to make several calls to an api, and concatenate the results. I am using angularJS

$scope.myFunction = function() {
  let res;
  for (//some condition) {
    let data = MyService.query();
    data.$promise.then(function(r){
      // here I receive the response from the api and I "concatenate" the result in a variable
      res += r.someValue;
    }
  }
  // here I need to do something with **res** when all the api calls are done
}

the problem is that the code outside of the for loop is executed before all the api calls return a result.

How can I make the code after the for loop to wait all the code inside the loop is executed, and the res variable is fully populated? Using async/await does not work as I am getting this error

"angular.js:12808 ReferenceError: regeneratorRuntime is not defined"

and at the moment I can't add packages to package.json.

Answer 1

You can use Promise.all something like

$scope.myFunction = function() {
  let res=[];
  for (//some condition) {
    let data = MyService.query();
   let respPromise= data.$promise.then(function(r){
      // return the response 
      return r.someValue;
    })
    res.push(respPromise);
  }
  Promise.all(res).then(data=>{
    console.log(data);//data should contains all the responses here
  })
}

Working stackblitz