Calling APIs in a loop - Angular js

Question

I have a set of APIs which I have to run inside a for loop

for(var i=0; i<array.length; i++ )
    service.getfunction(array[i]).then(function(response) {
      service.getfunction1(response).then(function(response) {
        service.getfunction2(response).then(function(response) {
          service.getfunction3(response).then(function(response) {
             console.log(response);
          });
        });
      });
    });
)

Second loop should start only after I got result from last getfunction3 API for first loop. How can I do this?

DontRelaX · Accepted Answer · 2017-11-23 12:26:50Z

2

First of all - you can chain your promises like:

function doJob(i) {
  return service.getfunction(array[i]).then(function(response) {
    return service.getfunction1(response);
  }).then(function(response) {
    return service.getfunction2(response);
  }).then(function(response) {
    return service.getfunction3(response);
  }).then(function(response) {
    console.log(response);
  });
}

This function will return promise that will be resolved once all this service calls done. And now lets use it:

var p = Promise.resolve(true);
for(var i = 0; i < array.length; i++) {
  (function(idx) { //We need to wrap it or we will pass incorrect i into doJob
    p = p.then(function() {
      return doJob(idx);
    });
  })(i);
}
p.then(function() {
  console.log('Everything done');
});

edited Nov 23, 2017 at 12:26

answered Nov 23, 2017 at 9:47

DontRelaX

7544 silver badges10 bronze badges

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

3 Comments

Daniel B Over a year ago

This can be alot simplified by omitting the return service.getfunctionX(response). The then will by default return the resolved value from the previous promise, thus you can simply write service.getFunction(array[i]).then(service.getfunction1).then(service.getfunction2).then(service.getfunction3)...

Anna Over a year ago

What if any of the API got failed?

DontRelaX Over a year ago

@Anna you can use second argument of then function to handle errors, or chain catch function. It will get all error from whole chain after last catch.

Jeffrey Roosendaal · Accepted Answer · 2017-11-23 09:46:50Z

0

Wrap it in a function:

// Declare function 
function LoopAPI() {
    for(var i=0; i<array.length; i++ )
        service.getfunction(array[i]).then(function(response) {
          service.getfunction1(response).then(function(response) {
            service.getfunction2(response).then(function(response) {
              service.getfunction3(response).then(function(response) {
                 console.log(response);

                 // Call function again
                 LoopAPI();
              });
            });
          });
        });
    )
}

// First call
LoopAPI();

edited Nov 23, 2017 at 9:46

answered Nov 23, 2017 at 9:41

Jeffrey Roosendaal

7,1978 gold badges45 silver badges58 bronze badges

Comments

Marcus · Accepted Answer · 2017-11-23 21:33:49Z

0

You can chain promises then use Array.reduce to call them in order as such:

array.reduce(function(previous, next)
{
    return previous.then(function()
    {
        return service.getfunction(next);
    })
    .then(function(response)
    {
        return service.getfunction1(response);
    })
    .then(function(response)
    {
        return service.getfunction2(response);
    })
    .then(function(response)
    {
        return service.getfunction3(response);
    });
}, Promise.resolve())
.then(function()
{
    console.log("All done.");
})
.catch(function(error)
{
    console.log(error);
});

answered Nov 23, 2017 at 21:33

Marcus

3504 silver badges11 bronze badges

Collectives™ on Stack Overflow

Calling APIs in a loop - Angular js

3 Answers 3

3 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related