37、构建 Angular 应用：从数据模型到组件展示

构建 Angular 应用：从数据模型到组件展示

在 Angular 应用开发中，我们需要谨慎处理 tsconfig.json 文件的更改，因为这些更改可能会破坏 Angular 工具链的其他部分。通常，Angular 项目中的大多数更改是通过 angular.json 文件进行的。

1. 创建数据模型

首先，我们要创建数据模型。创建 src/app/data 文件夹，并在其中添加一个名为 entities.ts 的文件，代码如下：

export type Product = {
    id: number,
    name: string,
    description: string,
    category: string,
    price: number
};
export class OrderLine {
    constructor(public product: Product, public quantity: number) {
        // no statements required
    }
    get total(): number {
        return this.product.price * this.quantity;
    }
}
export class Order {
    private lines = new Map<number, OrderLine>();
    constructor(i