AngularFire2：从数据库中获取空对象

Question

我正在关注 AngularFire2 为我的项目设置 Firebase 的文档。我无法从数据库中检索任何数据。

  contacts:Observable<any[]>;
  constructor(angularFire: AngularFirestore, public http: Http) { 
    this.contacts = angularFire.collection('mycontacts').valueChanges()   
    console.log("Contacts : "+ this.contacts)
  }

我的 Firebase JSON 结构如下：

"mycontacts" : {
"Contacts" : {
  "John" : {
    "Address" : "3 London Road",
    "Email" : "john@hotmail.com",
    "FirstName" : "John",
    "LastName" : "Snow",
    "PhoneNo" : "074236482878"
  }}}

结果：

Answer 1

正如您正确定义的那样，组件中的contacts 属性是Observable。因此，只需 console.logging 它不会为您提供您正在寻找的数据。如果你想提取组件内部的数据，那么你必须使用subscribe订阅它

angularFire.collection('mycontacts').valueChanges().subscribe((data) => {
 this.contacts = data;
});

话虽如此，如果您只想在页面（模板）上显示数据，那么您可以简单地使用 async 管道在页面上异步显示 Observable 数据。

this.contacts = angularFire.collection('mycontacts').valueChanges(); // same code you had

在您的模板中，例如使用管道

<div *ngFor="let contact of contacts | async" [innerHTML]="contact"></div>

希望对你有帮助。