< td></td>上的* ngIf和* ngFor元素 [英] *ngIf and *ngFor on <td></td> element

问题描述

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

I have a situation where I need *ngIf and *ngFor directive on the same element. I found lot of answers on the stackoverlow but none for the this type of situation.

我有一张表，其中遍历对象数组并在标头中动态写入单元格:

I have a table in which I'm looping through the array of objects and dynamically write cells in header:

 <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的visible.我该如何实现?

I want to show/hide if object contains visible set to true. How can I achieve this?

推荐答案

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

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

它没有添加到DOM中.

It is not added to the DOM.

这篇关于< td></td>上的* ngIf和* ngFor元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！