21、Angular开发：产品视图添加与表单API介绍

Angular开发：产品视图添加与表单API介绍

1. 添加产品视图到ngAuction

在之前创建了ngAuction的主页后，接下来要创建产品视图。当用户在主页点击某个产品图块时，就会渲染该产品视图。产品视图的右侧会显示产品信息，左侧则展示其他建议产品，这和亚马逊展示产品描述时采用的营销技巧类似。

在进行生产构建时，建议开启生产模式，这样变更检测器只会进行一次检查，不会执行额外的绑定检查。要启用生产模式，需在调用 bootstrap() 方法之前，在应用中调用 enableProdMode() ，这也有助于提升应用性能。

1.1 创建产品组件和模块

• 生成产品模块 ：运行命令 ng g m product ，该命令会创建 product 文件夹和 product.module.ts 文件。由于产品视图会使用Flex Layout库，因此需要在 @NgModule() 装饰器的 imports 属性中添加 FlexLayoutModule ，代码如下：

import {NgModule} from '@angular/core';
import {CommonModule} from '@angular/common';
import {FlexLayoutModul