在Angular 7中如何使用*ngIf in *ngFor？

在Angular 7中，可以使用ngIf指令在ngFor循环中进行条件判断。*ngIf指令用于根据条件决定是否渲染某个元素或组件。

下面是在Angular 7中如何使用*ngIf in *ngFor的步骤：

1. 在组件的HTML模板中，使用*ngFor指令进行循环遍历。例如，假设有一个名为items的数组，可以使用以下代码进行循环遍历：

<div *ngFor="let item of items">
  <!-- 循环内容 -->
</div>

1. 在循环内容中，使用*ngIf指令进行条件判断。例如，如果要根据item的某个属性进行条件判断，可以使用以下代码：

<div *ngFor="let item of items">
  <div *ngIf="item.property === 'value'">
    <!-- 条件满足时的内容 -->
  </div>
</div>

1. 可以在*ngIf指令中使用任何合法的条件表达式。例如，可以使用逻辑运算符、比较运算符等来构建条件表达式。
2. 如果需要在条件不满足时显示备用内容，可以使用ng-template指令。例如，可以使用以下代码：

<div *ngFor="let item of items">
  <div *ngIf="item.property === 'value'; else alternateContent">
    <!-- 条件满足时的内容 -->
  </div>
  <ng-template #alternateContent>
    <!-- 条件不满足时的内容 -->
  </ng-template>
</div>

这样，就可以在Angular 7中使用*ngIf in *ngFor进行条件渲染了。

推荐的腾讯云相关产品：腾讯云云服务器（CVM）和腾讯云云数据库MySQL。

• 腾讯云云服务器（CVM）：提供可扩展的云服务器实例，适用于各种规模的应用程序和工作负载。了解更多信息，请访问：腾讯云云服务器（CVM）
• 腾讯云云数据库MySQL：提供高性能、可扩展的云数据库服务，适用于各种应用场景。了解更多信息，请访问：腾讯云云数据库MySQL