Chaining http calls in angular 2 in a for loop

Question

I have some code that looks like

//service.ts

addProduct(productId) {
   this.http.post(\'someUrl\', ReqData).map(json).subscribe(doStuff);
}

//component.         


        

Answer 1

First return the observable from your service method:

addProduct(productId) {
   return this.http.post('someUrl', ReqData).map(json).subscribe(doStuff);
}

And use a recursive function and call it in the subscribe callback for each of the items in your array:

let loop = (id: number) => {
  service.addProduct(id)
    .subscribe((result) => {
      // This logic can be modified to any way you want if you don't want to mutate the `producIds` array
      if (productIds.length) {
        loop(productIds.shift())
      }
    })
}

loop(productIds.shift())