Получить данные из firestore и поместить в массив в Ionic

Question

Я создаю приложение под углом, и одна из задач заключается в том, что мне нужно прочитать данные из Firestore и сохранить в массив, мой фрагмент кода выглядит следующим образом:

public getListingData(): Observable < RequestListingModel > {
  console.log("getting listing...");
  
  this.firestore.collection('Requests').snapshotChanges().subscribe(
    requests => {
      this._listRequestItems = requests.map(a => {
        const data = a.payload.doc.data() as RequestItemModel;
        data.requestId = a.payload.doc.id;

        console.log("doc found - " + data.requestId);
        return data;
      })

    });

  const requestListingModel = {
    items: this._listRequestItems
  }
  as RequestListingModel;

  return of(requestListingModel);
}

И мой код RequestListingModel выглядит следующим образом:

import * as dayjs from 'dayjs';

export class RequestItemModel {
  name: string;
  address: string;
  category: string;
  requestId: string;
  postBy: string;
  description: string;
  // Default mock value
  // expirationDate = '12/01/2018';
  expirationDate: string = dayjs().add(5, 'day').format('MM/DD/YYYY HH:mm:ss') as string;
}

export class RequestListingModel {
  items: Array<RequestItemModel> = [];

  constructor(readonly isShell: boolean) { }
}

И он не работает, так как я всегда получаю пустое возвращение при вызове функции getListingData (), но консоль может напечататькаждый запрос успешно выполнен, я думаю, что что-то не так с тем, как я храню в массив, пожалуйста, помогите, спасибо!

Answer 1

Ваша проблема возникает из-за того, что все происходит асинхронно:

Итак, return of(requestListingModel); вызывается до того, как this.firestore.collection('Requests').snapshotChanges().subscribe(...) заполняет массив, возвращая таким образом наблюдаемый пустой массив.

Так как онпохоже, что вы хотите вернуть наблюдаемое, не subscribe() внутри вашего метода.Просто сделайте map() на snapshotChanges наблюдаемой для преобразования вывода и позвольте потребляющему коду подписаться на ваш getListingData() метод.

public getListingData(): Observable < RequestListingModel > {
    console.log("getting listing when someone subscribes...");


    return this.firestore.collection('Requests').snapshotChanges().pipe(
        map(requests => { 
            let requestListingModel = {
                items: []
            } as RequestListingModel;

            requests.map(a => {
                let data = a.payload.doc.data() as RequestItemModel;
                data.requestId = a.payload.doc.id;

                console.log("doc found - " + data.requestId);

                requestListingModel.items.push(data);
            });

            return requestListingModel;
        })
    );
}

Примечание: все же ... не могу проверить этона данный момент, возможно, это не на 100% правильно: - \
Но, надеюсь, направит вас в правильном направлении.: -)