When working with a product, it's important to keep in mind that it can be undefined or null; furthermore, the price within the product can also be undefined or null.
For example:
getClasses(key: number): string {
let product = this.model.getProduct(key);
return `pa-1 ${product.price < 50 ? "bg-info" : "bg-warning"}`;
}
This code snippet might result in:
TS Object is possibly undefined
But when adjusted to:
getClasses(key: number): string {
let product = this.model.getProduct(key);
return `pa-1 ${product && product.price ? product.price :0 < 50 ? "bg-info" : "bg-warning"}`;
}
}
it works fine.
If you find the line
product && product.price ? product.price :0product?.price?||0 could work instead.