Is there a way to query a RTDB list on the new web SDK and simply get the value instead of snapshot changes?

Viewed 83

I'm jumping between angularfire, rxfire and firebase-sdk docs and I can't find an answer.

With version 8 of the firebase-sdk API I could simply query RTDB and get the result of my query (not a bunch of snapshot changes). How can I do that with the new API ?

I couldn't find it on any of those docs. Is it possible via angularfire ? rxfire ? firebase-sdk ?

I'm trying to bind a ngFor to the result of my query. I don't want to have to manually handle child_added, child_removed, child_changed, etc.

1 Answers

The documentation for angular/fire 7 is still largely incomplete which can be frustrating when trying to build a project with it. To get a node list from RTDB and display it with an ngFor loop you can do the following

imports:

import {Database, listVal, ref} from "@angular/fire/database";

declare observable:

  rtdb: Observable<any[] | null> | undefined;

constructor:

  constructor(private database: Database) {}

function to return the data:

  async getNodeList() {
    const nodeRef = ref(this.database, 'path/to/node/list');

    this.rtdb = listVal(nodeRef);

    this.rtdb.subscribe(data => {
      console.log(data);
    });
  }

your HTML template:

<ng-container *ngFor="let item of rtdb | async">
  {{ item| json }}
</ng-container>
Related