試圖從離子 Angular 中的 Firebase 獲取 object

Question

我正在嘗試從 object 獲取詳細信息。

我將數據存儲為：

async createRecord() {
    const user = await this.fbauth.authState.pipe(first()).toPromise();
    const record = {};
    record['Name'] = this.roomName;
    record['Number'] = this.roomNumber;
    record['Description'] = this.roomDescription;
    record['User'] = { email: user.email };
    this.crudService.create_NewRoom(record).then(resp => {
      this.roomName = "";
      this.roomNumber = undefined;
      this.roomDescription = "";
      this.roomUser = toString();
      console.log(resp);
      this.router.navigate(['rooms']);
    })
      .catch(error => {
        console.log(error);
      });
  }

服務.ts

read_Room(id) {
    return this.firestore.doc('Rooms/' + id);
  }

create_NewRoom(record) {
    return this.firestore.collection('Rooms').add(record);
  }

room.page.ts：

roomView(record) {
    const navigationExtras: NavigationExtras = {
      queryParams:{
        info: this.crudService.read_Room(record)
      }
    }
    this.router.navigate(["roomview"], navigationExtras);
  }
}

roomview.page.ts：

constructor(private route: ActivatedRoute, private router: Router) { 
      this.route.queryParams.subscribe(params => {
          if (params && params.info) {
            this.data = params.info;
          }
          console.log(params);
      });
  }

roomview.page.html

<ion-card-title>
   {{ data }}
</ion-card-title>

並返回我只得到：

{信息：“[對象對象]”}信息：“[對象對象]”原型：Object

但我希望看到我在 object 中的數據，例如名稱和編號。 任何幫助，將不勝感激！

Answer 1

假設你使用@angular/fire在你的 read_Room(id) 方法中嘗試實現這樣的東西，它實際上會從 firestore 中提取一些東西：

read_Room(id) {
  this.firestore.collection('Rooms').doc(id).ref.get().then(r => {
    return r.data();
  });
}

https://firebase.google.com/docs/firestore/query-data/get-data這可能是您正在尋找的指南。