html ngIf检查对象是否为空[完成]

bpzcxfmw 于 2023-03-06 发布在其他

关注(0)|答案(6)|浏览(187)

我有一个名为“天”列表。

export class Day{
    id:number;
    name: string;
    items: Object;
}

我想显示“你好”时，项目是空的。我尝试使用 *ngIf，但它不工作。这是我的代码。

<div class=" list" *ngFor="let day of days">
    <div class="list-name">
        <strong>
            {{day.name}}
        </strong>
        <div *ngIf= "day.items === 0">
            Hello
        </div>
    </div>
    <div *ngFor="let item of day.items">
        <div class="column" [style.background-image]="'url(' + item.photoPath + ')'">
            <h4 class="item-name">{{item.name}}</h4>
        </div>
    </div>
</div>

Html

来源：https://stackoverflow.com/questions/56696815/ngif-check-if-object-is-empty-done

6条答案

按热度按时间

roqulrg31#

必须使用length来检查数组大小

<div *ngIf= "day.items?.length === 0">

赞(0）回复(0）举报 2023-03-06

ocebsuys2#

试试这个

<div *ngIf= "day.items.length === 0">

赞(0）回复(0）举报 2023-03-06

v7pvogib3#

您可以使用<div *ngIf= "day.items == null || day.items.length === 0">来检查项目是否为null或空。
演示https://stackblitz.com/edit/angular-scssrw

赞(0）回复(0）举报 2023-03-06

bvn4nwqk4#

我觉得items不是一个数组。它是一个对象。在一个对象上使用ngFor会导致一个错误。
其次，你应该在一个数组上使用.length来获得对象的计数。所以它应该是，

<div *ngIf= "day?.items?.length === 0">

赞(0）回复(0）举报 2023-03-06

wooyq4lh5#

您可以简单地在插值内使用条件语句表达式，而不使用'ngIf'。

...
<strong>
   {{ (day.item && day.item?.length) ? day.name : day.name + 'Hello' }}
</strong>
...

赞(0）回复(0）举报 2023-03-06

vulvrdjw6#

实际上，问题是要找到对象的长度，这只能使用Object. keys（myObj）. length。在Angular中，您可以使用它：
在. ts文件中：

objectKeys = Object.keys;

在html文件中：

<div *ngIf="objectKeys(myObj).length > 0"></div>

参考资料如下：https://stackblitz.com/edit/angular-object-length-xzxajl?file=app%2Fapp.component.html

赞(0）回复(0）举报 2023-03-06

我来回答

html ngIf检查对象是否为空[完成]

6条答案

相关问题

热门标签

最新问答