使用 angular firestore 获取数据

Question

我是 angular firestore 的新手，我正在尝试从 firestore 获取数据。我有以下代码：

import { AngularFirestore } from '@angular/fire/firestore';

export class ProfileComponent implements OnInit {
    myArray: any[] = []
    constructor(private authService: AuthService, public afs: AngularFirestore) {}

    test = this.afs.collection('doctors').get().subscribe((ss) => {
        ss.docs.forEach((doc) => {this.myArray.push(doc.data()); });
    });
}

在我的 html 文件中，我尝试这样显示 myArray：

<li *ngFor='let doc of myArray'>
     {{doc}}
</li>

我知道我的数组在我的 firebase 中正确读取了 table 'doctors'，因为它打印了三个对象，这是我 table 医生现在的元素数量，但我在 html 中获得以下输出：

有人可以帮我正确显示这些值吗？ Table 医生有电子邮件、名字和姓氏。我想打印每个实体的电子邮件。

Answer 1

您需要使用 json 管道显示数据，如下所示：

<li *ngFor='let doc of myArray'>
     {{doc | json}}
</li>

当您想要显示一个对象时，json 管道是必需的，它主要用于调试。文档中的更多信息： Angular - JsonPipe

使用 angular firestore 获取数据

get data with angular firestore

firebase

typescript

angularfire2

angular

google-cloud-firestore