*ngIf和*ngFor on <td> </ td>元素

Question

我有一种情况,我需要在同一元素上使用*ngIf和*ngFor指令.我在stackoverlow上找到了很多答案,但在这种情况下没有找到答案.

我有一个表,我循环遍历对象数组并动态写入标题中的单元格:

 <table border="1" width="100%">
        <thead>
            <tr>
                <td *ngFor="let item of headerItems" *ngIf="item.visible">{{ item?.name }}</td>
            </tr>
        </thead>
        <tbody>
            ...
        </tbody>
    </table>

我想显示/隐藏对象是否包含可见设置为true.我怎样才能做到这一点？

Answer 1

您可以使用<ng-container>辅助元素.

<ng-container *ngFor="let item of headerItems" >
 <td *ngIf="item.visible">{{ item?.name }}</td>
</ng-container>

它没有添加到DOM中.

Answer 2

GünterZöchbauer的答案很棒.我还找到了另一个解决方案.

<td *ngFor="let item of headerItems" [hidden]="!item.visible">{{ item?.name }}</td>

但是这个将在html中解析.