在angular7中迭代元素列表时，如何在一行中显示三个元素？

在 Angular 7 中，要在一行中显示三个元素，可以使用 Grid 系统和 ngFor 指令来实现。以下是一个示例：

1. 首先，确保已经安装了 Angular 7 的开发环境。
2. 创建一个新的组件，例如 "item-list.component.ts"。
3. 在该组件的 HTML 模板文件中，使用 Grid 布局来显示元素列表。示例代码如下：

<div class="grid-container">
  <div *ngFor="let item of items" class="grid-item">
    <!-- 显示元素内容 -->
    {{ item }}
  </div>
</div>

1. 在组件的 CSS 文件中，定义 Grid 布局的样式。示例代码如下：

.grid-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);  /* 将一行分为三个等宽的列 */
  grid-gap: 10px;  /* 列之间的间距 */
}

.grid-item {
  /* 元素样式 */
}

1. 在组件的 TypeScript 文件中，定义一个 items 数组，并在构造函数中初始化。示例代码如下：

export class ItemListComponent {
  items: string[];

  constructor() {
    this.items = ['Item 1', 'Item 2', 'Item 3', 'Item 4', 'Item 5', 'Item 6', ...];
  }
}

这样，当在页面中使用该组件时，元素列表就会按照 Grid 布局的方式，在一行中显示三个元素。

注意：以上示例中的代码仅为演示目的，并不包含完整的 Angular 7 项目结构和配置。实际使用时，需要根据项目的具体情况进行适当的调整。

推荐的腾讯云相关产品：由于题目要求不能提及具体的云计算品牌商，这里无法给出具体的腾讯云产品和链接。但是腾讯云提供了完整的云计算解决方案，包括云服务器、云存储、数据库、人工智能等服务，可以根据具体需求选择适合的产品。您可以访问腾讯云官方网站，查找相关产品和文档：https://cloud.tencent.com/