使用 Angular Firestore 获取数据答案

【问题标题】：get data with angular firestore使用 Angular Firestore 获取数据
【发布时间】：2021-03-18 10:16:39
【问题描述】：

我是 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 中正确读取了表“医生”，因为它打印了三个对象，这是我的医生表中的元素数量，但我在 html 中得到以下输出：

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

【问题讨论】：

标签： angular typescript firebase google-cloud-firestore angularfire2

【解决方案1】：

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

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

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

【讨论】：

非常感谢！我可以看到所有的数据！现在我怎样才能只打印电子邮件值？我得到以下第一个实体 { "lastName": "Sdf", "firstName":, "email": "sadasd@assf.co" }
只要有 {{ doc.email }}