使用Angular对Firestore的嵌套可观察查询

Question

我已经建立了我的Firestore数据库，如

1. 约会
   • 3LDB7GogQNfwOtbxuVY2
     • 预约时间：2019年5月10日世界标准时间+5：30 17:30:00
     • 患者：/ patients / xCdynS1N33t0erFY3H0N
     • 注册时间：2019年4月30日世界标准时间+5：30 18:57:00
2. 患者
   • xCdynS1N33t0erFY3H0N
     • 名称：“ NAME”
     • 联系方式：1234567890
     • 电子邮件：“ email@domail.com”

我正在尝试列出所有约会的详细信息以及患者的详细信息。

这是我的仪表板组件

export class DashboardComponent implements OnInit {

  private patientDocument: AngularFirestoreDocument<Patient>
  patient: Observable<Patient>
  private appointmentsCollection: AngularFirestoreCollection<Appointment>;
  appointments: Observable<Appointment[]>;

  constructor(private afs: AngularFirestore) {
  }

  ngOnInit() {
    this.appointmentsCollection = this.afs.collection('appointments')
    this.appointments = this.appointmentsCollection.valueChanges();

    this.appointments.subscribe(appointments => {
      appointments.forEach(appointment => {
        this.patientDocument = this.afs.doc(appointment.patient);
        this.patient = this.patientDocument.valueChanges()

        this.patient.subscribe(patient=>{
          console.log(patient.email)
        })
      })
    });

  }

}

这是html代码段

<div *ngFor="let appointment of appointments | async">
  <h3>{{ patient.email}}</h3>

  <h3>{{ appointment.appointmentAt.seconds * 1000 | date: 'medium'}}</h3>
</div>

我实际上可以记录患者详细信息。即在此处发送电子邮件

但是我无法在html上显示它。

提前谢谢