3

我用 angularfire2 和 rxjs 6 创建了一个新的 angular6 项目。我正在调试要在加载 observables 时显示的加载栏。

我的 ts 代码：

import { combineLatest, Observable } from 'rxjs';

groups: Observable<Array<any>>;
singles: Observable<Array<any>>;
combined: Observable<Object>;

public loadall()
{
    this.groups= this.db.collection('groups').valueChanges();
    this.singles= this.db.collection('singles').valueChanges();
    this.combined = combineLatest(this.groups, this.singles);
    //took this from https://auth0.com/blog/whats-new-in-rxjs-6/
}

我的html模板：

<ng-template #loading>
  <div class="loader"></div>
</ng-template>

<div *ngIf="combined | async; else loading"> //this div
  <div *ngFor="let group of groups | async">
    {{ group.name }}
    <div *ngFor="let single of singles | async">
      {{ single.name }}
    </div>
  </div>
</div>

当前没有 //this div 括号，将显示输出。但是，使用 //this div 括号时，不会显示输出。

在以前版本的 rxjs 中，我使用了：

this.combined = Observable.combineLatest(query$);

这有效。所以我认为我对 combineLatest 运算符的实现是错误的。感谢帮助进一步调试。

4

0 回答 0