Currently, I am working on a project that involves Angular and Laravel. One interesting issue has arisen in one of my components where I receive a variable from the database as an object array. Surprisingly, even though I only loop through this variable without making any changes to it directly, it seems to update automatically whenever my looping function is called. This behavior has left me puzzled as to the underlying cause. Could it be related to asynchronous operations or perhaps something related to observable subscription?
...
allOrder: { date_time: Date, tableID: string, identity: string, paid: boolean, orders: Order[]}[] = [];
...
constructor(private basicService: BasicService) {
this.getOrder();
}
...
getOrder(): void {
this.basicService.getOrders().subscribe(items => {
items.map(item => {
this.allOrder.push(item);
}
})
})
}
...
onAllOrder() {
var displayAllOrder = [];
var displayNum = 0;
this.allOrder.map(itemsAll => {
itemsAll.orders.map(itemAll => {
displayAllOrder.map(groupItem => {
if(groupItem.productID == itemAll.productID){
groupItem.num = groupItem.num + itemAll.num;
displayNum = 1;
}
})
if(displayNum == 0) displayAllOrder.push(itemAll);
displayNum = 0;
})
});
}
The perplexing part is that despite not modifying the 'allOrder' variable directly, it mysteriously changes each time I invoke the 'onAllOrder()' function. Any insights on what could be causing this unexpected behavior would be greatly appreciated.