In my project, I am making multiple calls to two different backend services. The first call is to retrieve the IDs of "big" items, and then subsequent calls are made to get the details of each "big" item using its ID.
I have explored options like concatMap()
, switchMap()
, mergeMap()
from various sources such as a helpful post on Stack Overflow:
Rxjs One Observable Feeding into Another. However, I am struggling to figure out how to loop through an unknown number of calls to the second collection.
The current approach I am using works fine, but I want to move away from nested subscriptions.
Should I consider using Promises instead of RxJS for this particular task?
loadWigitsDetailed() {
this.wigitGetterService
.fetchWigitIds({
category: 'big'
})
.subscribe(response => {
// say, 5 items returned.
for (const oneWig of response.items) {
this.detailedWigitInfoService.fetchWigitInfo({ id: oneWig.id })
.subscribe(responseDetail => {
wigitTable.addRow(responseDetail);
});
}
});
}