Question

如果从json检索undefined，则要隐藏列表。任何人都可以提供帮助。

HTML file:

    <ul>
    <li *ngFor="let item of items | async"><span *ngIf="item?.name">{{item.name}}</span></li>
    </ul>

Json文件：

    {
    "chat" : {
      "-Kss3KDwaLDpzAHUKtJN" : {
            "id" : "11",
            "name" : "Shanth",
            "message" : "Hi ..!"
            },
      "-Kss3Kc9c2Ie5IXypqNe" : {
            "id" : "12",
            "name" : "",
            "message" : "Hi .."
            },
      "-KssBwcJhkNCsxUUhsXb" : {
            "id" : "13",
            "name" : "Prasanth",
            "message" : "Hi .."
            }
     }

我得到的结果如下：

1. Shanth
2. 
3. Prasanth

我不想显示第二个列表。它应显示为

1. Shanth
2. Prasanth

Answer 1

这将解决您的问题。

<ul>
  <div *ngFor="let item of items">
    <li *ngIf="item.name"><span>{{item.name}}</span></li>
  </div>
</ul>

Answer 2

在li而不是span

上使用if条件

<li *ngFor="let item of items | async" [style.display]="item.name?'block':'none'"><span >{{item.name}}</span></li>

您也可以使用其中一个答案中提到的ng-container。请查看三重答案。

Answer 3

试试这个

<ul>
  <ng-container *ngFor="let item of items | async">
    <li *ngIf="item.name">...</li>
  </ng-container>
</ul>

如果变量值在角度4中未定义，如何隐藏列表？

3 个答案: