38、打造完整的 Angular 应用：功能实现与部署指南

打造完整的 Angular 应用：功能实现与部署指南

1. 开发前准备

在继续开发 Angular 应用前，需开启 Web 服务与开发工具。步骤如下：
1. 打开新的命令提示符。
2. 导航至项目文件夹。
3. 运行 npm start 命令。

构建完成后，打开浏览器访问 http://localhost:4200 即可查看示例应用。

2. 完善应用功能

2.1 创建订单详情组件

在 src/app 文件夹下添加 orderDetails.component.ts 文件，代码如下：

import { Component } from "@angular/core";
import { Router } from "@angular/router";
import { Order } from "./data/entities";
import { DataSource } from './data/dataSource';
@Component({
    selector: "order-details",
    templateUrl: "./orderDetails.component.html"
})
export class OrderDetails {
    constructor(private dataSource: DataSource, private router: Router) {}