0

I have a situation where I need to call 4 services with dependency on previous service result.

For instance, there are 4 tabs\buttons named 'Level 1', 'Level 2', 'Level 3' and 'Level 4'.

On load of screen, I need to call just 'Level 1' service: this.levelService.getLevel1() //returns observable and bind the result of this to a array variable level1Arr (this will be a check box list, in which 10 items will be checked by default).

Next, when user clicks on 'Level 4', I need to pass those 10 level1Arr item ids(1,2,3,4,5,6,7,8,9,10) as input to 2nd service this.levelService.getLevel2(), which again returns a result back and will be stored in level2Arr. Now I need to call this.levelService.getLevel3() by passing 2 parameters (from leve1Arr and level2Arr). Similarly this.levelService.getLevel4() (with 3 parameters this time) will be called.

This can be done by calling subsequent services within the result of previous service. However, the number of levels will be dynamic and may vary. Hence I wanted to know if there is any better way in Angular \ Observable to handle such case.

Deepak
  • 1,038
  • 4
  • 18
  • 31
  • I think you're looking for the `concat` operators. See [this question.](https://stackoverflow.com/a/43338150/1447173) – Daniel B Oct 12 '17 at 12:53
  • did you check on fork join or flatmap – Rahul Singh Oct 12 '17 at 12:57
  • Thank you Daniel. I'll try that option and let you know how it goes. – Deepak Oct 12 '17 at 12:57
  • 1
    Possible duplicate of [How to force observables to execute in sequence?](https://stackoverflow.com/questions/43336549/how-to-force-observables-to-execute-in-sequence) – martin Oct 12 '17 at 13:16
  • Possible duplicate of [How to chain Http calls in Angular2](https://stackoverflow.com/questions/34104638/how-to-chain-http-calls-in-angular2) – AT82 Oct 14 '17 at 11:03

0 Answers0