循环对象值错误 AngularFire 文档 ID

Question

我在使用 AngularFire 的 Angular 项目中遇到 "Cyclic Object Value" 错误。我是 Firebase 的新手，所以也许有一个简单的解决方法，但我找不到。

首先，我在我的 Firestore 数据库中查询一个集合，然后我尝试使用第一个集合中的文档 ID 查询另一个集合。

这是相关代码：

foo.service.ts:

async checkOrgas() {
    let orga: any;
    const user = await this.afAuth.currentUser;
    const results = this.db
      .collection('orgas', (ref) => {
        return ref.where('createdBy', '==', user.uid);
      })
      .valueChanges({ idField: 'orgaID' })
      .pipe(take(1));
    return results;
  }

async getOrgaBankings(orgaID: string) {
    const results = this.db.collection('bankings', (ref) => {
      return ref.where('orga', '==', orgaID);
    }).valueChanges({ idField: 'bankingID' });
    return results;
  }

foo.component.ts:

async getOrga() {
    const orgas = await this.orgaService.checkOrgas();

    this.orgasSubscription = orgas.subscribe((val) => {
      this.orga = val[0];
      val.length > 0 ? (this.memberOfOrga = true) : (this.memberOfOrga = false);
  }

async loadOrgaBankingInfo() {
    this.orgaBanking = this.orgaService.getOrgaBankings(this.orga.orgaID);
  }

Firefox 中的确切错误是

ERROR TypeError: "cyclic object value"

我对错误的含义有基本的了解，但即使有了这些知识我也不知道如何正确修复它。

Answer 1

如果有人运行遇到类似的问题，这里就是答案！

我确实解决了问题，首先，组件 HTML 中的 JSON 管道导致了错误。

问题出在以下函数中：

async loadOrgaBankingInfo() {
    this.orgaBanking = this.orgaService.getOrgaBankings(this.orga.orgaID);
  }

我忘记订阅 getOrgaBankings()，因此，我在 Observable 而不是数组上使用了 JSON 管道。

重构函数后，一切都按预期运行：

async loadOrgaBankingInfo() {
    this.orgasSubscription.unsubscribe();
    const orgaBanking = await this.orgaService.loadOrgaBankings(
      this.orga.orgaID
    );
    orgaBanking.subscribe((val) => {
      console.log(val);
    });
  }

循环对象值错误 AngularFire 文档 ID

Cyclic Object Value Error AngularFire Document ID

firebase

typescript

angularfire

angular