If condition after result of Promise

Question

I have a problem with a promise. I have this function that is used to comunicate with Firestore database:

  async getDataFromDB() {
    const junctionRef = firebase
      .firestore()
      .collection('junction')
      .doc(this.id)
      .collection('items')
      .doc(this.userId);
    return await junctionRef.get().then((doc) => {
      const details = doc.data();
      return details;
    });
  }

In ngOnInit method I call this funtion and, based on the result of this promise, I want to set some values:

  ngOnInit() {
    ....
    this.getDataFromDB().then((data) => {
      if(data != null && data.numbers<10 )
        // TO SOMETHING
    });

But it never enters the if because data tells me it is undefined . How can I solve it ?

score 1 · Answer 1 · answered Apr 13 '22 at 16:48

1

Try to use Promise. Something like this.

getDataFromDB(): Promise<any>
return new Promise((resolve, reject) => {
const junctionRef = firebase
      .firestore()
      .collection('junction')
      .doc(this.id)
      .collection('items')
      .doc(this.userId);

junctionRef.get().then((doc) => {
      const details = doc.data();
      resolve(details);
    });

answered Apr 13 '22 at 16:48

Ondřej Bauer

91
6

Hi Ondrej, thanks for the reply. I tried with your code but the same return undefined – sirss Apr 13 '22 at 17:12
1

OK and what if you log const details = doc.data(); to console just before result? – Ondřej Bauer Apr 14 '22 at 18:41

score 0 · Answer 2 · answered Apr 13 '22 at 18:02

Try this approach:

async ngOnInit() {
    try {
        this.loading = true;
        const commerces = await this.db.getCommerces();
        this.dataSource = new MatTableDataSource(commerces);
    } catch (error) {
        // Your logic to handle the error
    } finally {
        this.loading = false;
    }
}

database.service.ts

public async getCommerces() {
    let commerces: Commerce[] = [];
    try {
        const colRef = collection(this.db, COLLECTION_COMMERCES);
        const docs = await getDocs(colRef);
        if (docs.size <= 0) throw 'size-error';
        docs.forEach(item => commerces.push(item.data() as Commerce));
        return commerces;
    } catch (error) {
        throw error;
    }
}

In general, when you want to return correct data, you just return it, and when you want to handle errors, you have to do it with a throw. At least firebase is programmed like this. And I find that the code is more readable.

If condition after result of Promise

2 Answers2