angular - <td></td> 元素上的 *ngIf 和 *ngFor

标签 angular angular2-directives

<分区>

我有一种情况需要在同一个元素上使用 *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>

如果对象包含 visible 设置为 true,我想显示/隐藏。我怎样才能做到这一点?

最佳答案

您可以使用 <ng-container>帮助元素。

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

它没有添加到 DOM。

关于angular - <td></td> 元素上的 *ngIf 和 *ngFor,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40860933/

相关文章:

javascript - 当可以访问 DOM 时需要回调

javascript - 为什么我在选择初始加载页面时出现错误?

javascript - 如何在 AngularJS 中使用 pickaday 指令禁用当前和 future 日期

angular - Angular 在文本输入中只允许数字

javascript - token 拦截器不会再次发送原始请求(Angular、Node.js)

java - 在 spring boot 2.0.5 中将具有不同数据类型的图像从 Angular 7 发送到 Rest API

angular - 使用带有angular2的异步管道不起作用

angular - 单击 md 对话框按钮后执行特定组件

angular - 无法从父结构指令访问子结构指令

javascript - 如何垂直制作angular2中ngx图表中的 "advanced pie chart"?