获取项目的长度 ngFor async / Observable<Aviso[]>;

Question

如何使用 ngFor 获取项目总数？

*ngFor="let aviso of avisosTest | async; let i = index"

我正在使用 Firebase 的 Firestore 和 Observable：

avisosTest: Observable<Aviso[]>;

我试过了，但没用

{{ avisosTest.length }}

{{ avisosTest?.length }}

Answer 1

我觉得你需要

<div *ngIf="(avisosTest | async)?.length==0">No records found.</div>

或

<div *ngIf="(avisosTest | async)?.length>0">{{avisosTest.legnth}}</div>

Answer 2

在 Angular 4 你可以这样做：

*ngFor="let aviso of avisosTest | async as aviso; let i = index"

然后您可以在该标记内调用 {{ avisosTest.length }}。

例子

<ul>
  <li *ngFor="let aviso of avisosTest | async as aviso; let i = index">
    {{aviso}} - {{i + 1}} of {{aviso.length}}
  </li>
</ul>

Working Demo - 数据加载等待 2 秒

如果在循环外需要，可以把async和ngFor分开，比如：

<div *ngIf="avisosTest | async as aviso">
  <ul>
    <li *ngFor="let aviso of aviso; let i = index">
      {{aviso}}
    </li>
  </ul>
  <div>
    {{aviso.length}} items total
  </div>
</div>

Working Demo - 数据加载等待 2 秒

获取项目的长度 ngFor async / Observable<Aviso[]>;

get length of items ngFor async / Observable<Aviso[]>;

ngfor

angular