I am currently working with a series of observables that operate in the following sequence: getStyles() --> getPrices()
Whenever a config.id is present in the configs array, getStyles() retrieves a style Object for it. This style Object is then passed to getLease where a price is added to it and stored in an array named "style"
getStyles(configs: any) {
configs.forEach(config => {
this._APIService.getStyleByID(config.id).subscribe(
res => {
res.config = config;
this.getLease(res);
}
);
});
}
getLease(style: any): void {
this._priceService.getPrice().subscribe(
price => {
style.price = price;
this.garage.push(style);
console.log(this.garage);
});
}
}
The challenge I am facing involves duplicate calls being made because the style array contains twice as many objects as necessary. The problem arises from Angular making two calls to this._APIService.getStyleByID() when I expect it to only make one call. How can I adjust my Observables to ensure they are executed only once?