1

Angularfire2 を使用して、Firebase と通信します。これはコードです。

import {Component} from '@angular/core';
import {AngularFire, FirebaseListObservable} from 'angularfire2';

@Component({
  selector: 'app',
  templateUrl: `
  <ul>
    <li *ngFor="let item in items | async">
      {{ item.name }}
    </li>
  </ul>
  `,
})
class AppComponent {
  item: Observable<any>;
  constructor(af: AngularFire) {
    this.item = af.database.list('/items');
  }
}

命令af.database.list('items')がデータを取得するのに数秒かかります。では、データが既にロードされていることをどのように知ることができますか? それがわかれば、「読み込みバー」を表示できます。

4

2 に答える 2

4

items次のように内部コンポーネントをサブスクライブしてみてください。

constructor(af: AngularFire) {
  this.item = af.database.list('/items');
  this.item.subscribe(() => this.showLoader = false);
}

いくつかのフィールドを使用して、ローダーの可視性を確実にバインドします

于 2016-07-15T15:32:09.047 に答える
0

私の悪い、setTimeout は問題を完全に解決しません。非同期アプローチを使用するのはどうですか。ただし、コードに q api をインポートする方法がわかりません。 

  constructor(af: AngularFire) {
    var def = $q.defer();
    this.item = af.database.list('/items');
    def.resolve(this.item);
  }
于 2016-07-15T13:21:31.117 に答える