如何有条件地将行添加到 angular 中的 table 5

Question

我是 Angular 5 的新手。我的 app.component.ts 中有一个对象数组。我想同时使用 *ngFor 和 *ngIf 创建 table 的行并同时应用条件。基本上像

<tr *ngFor="let row of rows" *ngIf="row['category']==='M'"><td>...</td><td>...</td></tr>

然而这是不允许的并且会显示错误：

Can't have multiple template bindings on one element.

如何实现？

Answer 1

使用 ng-container(documentaion link) 作为您的 ngFor.

<ng-container *ngFor= "let row of rows">
   <tr  *ngIf="row['category']==='M'"><td>...</td><td>...</td></tr>
</ng-container>

How to conditionally add rows to table in angular 5