Home > OS >  Getting empty data from Angular Firestore
Getting empty data from Angular Firestore

Time:06-27

I'm fairly new to Angular and have been struggling with some aspects of Firebase. I'm trying to retrieve the latest document in a collection to get the ID of the last document and use that (adding 1) to create the new document. I have a CRUD service file with:

import Pedido from './interfaces';
import { AngularFirestoreCollection, AngularFirestoreDocument } from '@angular/fire/compat/firestore';
import { AngularFirestore } from '@angular/fire/compat/firestore';
import { Injectable } from '@angular/core';
import { Router } from '@angular/router';
import { MatDialog } from '@angular/material/dialog';
import * as moment from 'moment';

@Injectable({
  providedIn: 'root'
})
export class CrudFirestoreService {
  productRef: AngularFirestoreCollection<Producto_interface>;
  private dbPedidosPath = '/Pedidos';
  constructor(private store: AngularFirestore, private router: Router, private dialog: MatDialog) {
    this.pedidosRef = store.collection(this.dbPedidosPath);
  }
  getLastPedido(): AngularFirestoreCollection<Pedido>{
    return this.store.collection(this.dbPedidosPath, ref => ref.orderBy('Fecha', 'desc').limit(1))
  }

Previously, I was calling this reference with snapshotChanges:

this.crud.getLastPedido().snapshotChanges()
    .pipe(map(changes => changes.map(c =>({cod: c.payload.doc.id, ...c.payload.doc.data() }))))
    .subscribe(data => { CALLBACK }

But I was running into the problem that it was getting called multiple times, even if the DB wasn't changing. Since I'm using the function callback to continue with the process, this meant that the process was being initiated multiple times.

this.crud.getLastPedido().get().subscribe(data => { 
          console.log("data",data)
          console.log("data[0]", data[0])
          CALLBACK }

However, when I tried this it ends up returning an empty object:

Object { _firestore: {…}, _delegate: {…} }
​
_delegate: Object { _firestore: {…}, _userDataWriter: {…}, _snapshot: {…}, … }
​​
_firestore: Object { type: "firestore", _persistenceKey: "angular-auth-firebase", _settingsFrozen: true, … }
​​
_snapshot: Object { fromCache: false, syncStateChanged: true, excludesMetadataChanges: false, … }
​​
_userDataWriter: Object { firestore: {…} }
​​
metadata: Object { hasPendingWrites: false, fromCache: false }
​​
query: Object { converter: null, _query: {…}, type: "query", … }
​​
<prototype>: Object { … }
​
_firestore: Object { _delegate: {…}, _persistenceProvider: {}, INTERNAL: {…}, … }
​etc.

In essence, I either need a better way to run my async functions so that I can use snapshotChanges and ignore the variable amount of times the callback function would get called, or I need to figure out why returning a single doc like this isn't working.

Thanks!

CodePudding user response:

instead of

this.crud.getLastPedido().get().subscribe(data => { 
          console.log("data",data)
          console.log("data[0]", data[0])
          CALLBACK }

try

this.crud.getLastPedido().get()
.pipe(
 map(res => res.docs.map((snap) => {
 return {
 id: snap.id, 
 ...snap.data()
 }))
)
.subscribe(data => { 
              console.log("data",data)
              )}
  • Related