I have a constant array of orders declared in the constants.ts file
export const ORDERS = [
{
'id': 'PROCESSING',
'displayName': null
},
{
'id': 'SHIPPED',
'displayName': null
}
];
Within my component, I am assigning values to the 'displayName' property
import { ORDERS } from './constants';
-----------------
--------------
setOrders() {
ORDERS.forEach((order: any) => {
if(order.id === 'PROCESSING') {
order.displayName = 'Processing';
}
if(order.id === 'SHIPPED') {
order.displayName = 'Shipped';
}
});
}
However, when I attempt to retrieve the values of 'displayName' in another function, it returns null, even though I can see the value of 'displayName' within the order object
getOrders() {
ORDERS.forEach((order: any) => {
console.log(order); // displayName exists in the object
console.log(order.displayName); // But here it shows null
});
}
Both functions reside in the same component. Can someone please assist me with resolving this issue? Thank you.
Update : Full implementation
getTimePeriod() {
return Promise.resolve((() => {
this.orderService.getTimePeriod()
.subscribe(
(data) => {
this.orderStatusList = data.configParameters;
this.orderStatusList.forEach(
(s: any) => {
if (s.status === 'PROCESSING') { this.setOrders(s.status, s.name); }
if (s.status === 'SHIPPED') { this.setOrders((s.status, s.name); }
}
);
},
error => {
this.errorMessage = this.orderService.handleError(error);
}
);
})());
}
setOrders(status, name) {
ORDERS.forEach((order: any) => {
if (order.id === status) {
order.displayName = name;
}
});
}
getOrders() {
return Promise.resolve((() => {
ORDERS.forEach((order: any) => {
const { displayName } = order;
console.log(order); // displayName exists in order
console.log(displayName); // Null
this.orderService.getOrdersByDisplayName(buildQuery(null, displayName, null, null))
.subscribe(
(data) => {
this.ordersWidgetInfo.push({
...order,
...data,
number: data.orders && data.orders.length,
});
},
error => {
console.log(`error for ${orderType} : ${error}`);
}
);
}
);
})());
}