Looking at the code snippet below:
- The initial HTTP call retrieves multiple IDs of orderlines (items).
- For each ID, another HTTP call is made to reserve them. Afterward, the page needs to be updated to display the reserved items.
When dealing with a large number of items, there was an issue where the page would reload before the reservations were completed on the backend. To address this, a delay of 0.7 seconds was added, but this is not considered best practice. I am exploring other options like switchMap to improve this process.
this.service.getOrderlineId(this.orderlineIds).subscribe((ids: Number[]) => {
ids.forEach(id => {
this.currentReservation = {
orderline: id,
company: this.currentUser.company_id,
company_name: this.currentCompany.name,
user: this.currentUser.user_id,
delivery_address: this.currentCompany.address
}
this.service.createOrderLineReservation(this.currentReservation).subscribe(reservation => {
})
})
})
setTimeout(() => {
this.clearGroups();
this.prepareRow();
this.prepareGroups();
}, 700);