显示由类型分隔的ngFor的数组

ngFor是Angular框架中的一个指令，用于在模板中循环显示数组或集合的元素。它可以根据指定的数组或集合的长度动态生成相应数量的HTML元素。

ngFor指令有两种常见的用法：使用关键字let和of，以及使用关键字let、index和of。

1. 使用关键字let和of的ngFor用法示例：

<div *ngFor="let item of items">{{ item }}</div>

上述代码中，items是一个数组，item是循环过程中当前元素的引用。在每次循环中，item会被赋值为数组中的一个元素，然后可以在模板中使用。

1. 使用关键字let、index和of的ngFor用法示例：

<div *ngFor="let item of items; let i = index">{{ i }} - {{ item }}</div>

上述代码中，i是循环过程中当前元素的索引值。在每次循环中，i会被赋值为当前元素的索引，item会被赋值为数组中的一个元素。

ngFor指令的优势：

• 简化了在模板中循环显示数组或集合的元素的操作。
• 可以根据数组或集合的长度动态生成相应数量的HTML元素。
• 提供了方便的索引值，方便在模板中使用。

ngFor指令的应用场景：

• 在一个列表中显示一组数据。
• 动态生成表格的行或列。
• 显示多个相同类型的组件。

腾讯云相关产品和产品介绍链接地址：

• 云服务器（CVM）：https://cloud.tencent.com/product/cvm
• 云数据库 MySQL 版（CDB）：https://cloud.tencent.com/product/cdb
• 腾讯云对象存储（COS）：https://cloud.tencent.com/product/cos
• 腾讯云人工智能（AI）：https://cloud.tencent.com/product/ai
• 腾讯云物联网通信（IoT）：https://cloud.tencent.com/product/iot
• 腾讯云移动开发（Mobile）：https://cloud.tencent.com/product/mobile
• 腾讯云区块链（BCBaaS）：https://cloud.tencent.com/product/baas
• 腾讯云元宇宙（Metaverse）：https://cloud.tencent.com/product/metaverse

请注意，以上链接仅供参考，具体产品选择应根据实际需求进行评估和决策。