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

Question

i have a list name "day".

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

i want to display "Hello" when items is empty. I try to used *ngIf but it doesn't work. This is my code.

<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>

Answer 1

As I seem items is not an array. It is an object. Using ngFor over an Object would resuslt in an error.

Secondly, you should use .length over an array to get the count of Objects. so it should be as,

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

Answer 2

您必须使用长度来检查数组大小

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

Answer 3

尝试这个

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

Answer 4

You can use <div *ngIf= "day.items == null || day.items.length === 0"> for check items is null or empty.

Demo https://stackblitz.com/edit/angular-scssrw

Answer 5

You can simply make use of conditional statement expression inside your interpolation without using 'ngIf'.

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