时间戳

首页 > 解决方案 > 有条件地消除 *ngFor 中的列表项 - Angular 6

angular - 有条件地消除 *ngFor 中的列表项 - Angular 6

问题描述

我正在尝试使用 row-col div 组合为带有标签和值项的列表创建一个 4 列表。问题是 - 我不想显示任何没有价值的列表项。不确定如何使用 *ngFor 和 *ngIf 来实现（因为它们都不能用于同一个元素。任何帮助将不胜感激。这是我的代码示例

编辑：正确使用<ng-container>. 下面的更新代码

<div class="container">

    <div class="row" *ngIf="myList && myList.length > 0">

        <ng-container *ngFor="let myField of myList">

            <div class="col-6" *ngIf="myField.udfDisplayValue">

                <div style="width: 50%; display: inline-block">
                    <b>{{ myField.fieldName }}</b>
                </div>

                <div style="width: 50%; display: inline-block;">
                    {{ myField.displayValue }}
                </div>

            </div>
        </ng-container>
    </div>
</div>

标签： angularhtmltwitter-bootstrapangular-ngfor

解决方案

你可以使用 [hidden] 而不是 *ngIf

推荐阅读