Question

我有一个组件和一项服务，可以一起从Firebase实时数据库中检索项目。

实时数据库存储人员及其名字（fname）和姓氏（lname）。

从我的组件中，从URL中检索“ id”，这是firebase中的唯一ID。
然后，我的编辑组件将服务引用到getSingleItem（this.id）。
这是ts文件的一部分：

constructor(
     private es: Service
){ }

ngOnInit() {
     // This code graps the "id" from the URL
     this.sub = this.route.params.subscribe(params => {
      this.id = params["id"];
    });

    this.item = this.es.getSingleItem(this.id);
    console.log(this.item); //returns strange object
    console.log(this.item.fname);// shows as undefined.
    console.log(this.item.lname);//shows as undefined
    

    this.editForm = this.fb.group({
      fname: [null], //cant get this.item.fname (comes as undefined)
      lname: [null]  //cant get this.item.fname (comes as undefined)
    });

然后在我的服务中，getSingleItem（）看起来像这样：

constructor(
private fdb: AngularFireDatabase
){ }

getSingleItem(id: string) { 
      const itemPath =  `people/${id}`;
      this.item = this.fdb.list(itemPath);
      return this.item
    }

但是回到组件中，当我console.log（this.item）时，它返回一个奇怪的对象，看起来像这样： {query: Reference, update: ƒ, set: ƒ, push: ƒ, remove: ƒ, …} 没有希望看到的实际数据的痕迹。

当我尝试执行console.log(this.item.fname)或console.log(this.item.lname)时，它是未定义的。

如何正确从数据库中检索项目？

Answer 1

您需要订阅this.fdb.list(itemPath)返回的监听器。

例如：

this.fdb.list(itemPath).valueChanges((value) => console.log(value));

或者如果您同时需要文档ID和值：

this.fdb.list(itemPath).snapshotChanges((doc) => console.log(doc.id, doc.data()));

由于您正在观察单个文档，因此您可能还需要使用doc而不是list。

如何从Firebase实时数据库中获取单个项目？

1 个答案: