CODEWITHSUNDEEP
javascriptangularfirebaseionic-frameworkfirebase-realtime-database
Marcel Fieser
Marcel Fieser

Reputation: 41

Promise returns a wrong type when accessing firebase

When the user enters the page, I want to check if the user has already put in data to a firebase location. I use this code for this purpose:

(Within the Provider:)

checkPath():  Promise<boolean> {

    return new Promise((resolve, reject) => {
        firebase.database().ref('/Data')
        .child(firebase.auth().currentUser.uid).child("dataID")
        .on('value', data => {
            resolve(data.exists());
        });
    });  
    }

(Within the page:)

ionViewDidEnter() {

  if(this.Provider.checkPath() === true) {

//Here I retrieve data from firebase

  }
}

But now the following Error occurs:

Type 'Promise<any>' is not assignable to type 'boolean'.

My first question is: was I right when using a Promise to check whether there is data from the user? In my opinion one needs a promise because otherwise the Page will do its things, but it could be that the data isn't loaded.

The second question is: how do I get a boolean out of the promises return to check if data is in the location? Or do you have any other solution to do this?

Upvotes: 0

Views: 446

Answers (2)

Poul Kruijt
Poul Kruijt

Reputation: 71891

First things first, the error you are getting is due to the latest TypeScript version. They require that you specify in your new Promise<T> statement what the return type of this Promise is going to be:

checkPath():  Promise<boolean> { 
    return new Promise<boolean>((resolve, reject) => {
        firebase.database().ref('/Data')
        .child(firebase.auth().currentUser.uid).child("dataID")
        .on('value', data => {
            resolve(data.exists());
        });
    });  
}

Second point is, you can't check your Promise return like that. You should use the await/async from TypeScript (which I prefer):

ionViewDidEnter() {
    this.checkPath();
}

async checkPath(): Promise<void> {
     if((await this.Provider.checkPath()) === true) {
          //Here I retrieve data from firebase 
    }
}

Or use basic Promise handling:

this.Provider.checkPath().then((result: boolean) => {
   if (result) {
       //Here I retrieve data from firebase
   }
})

Actually, I read your question correctly now, and the first thing I said is not what's causing your error. That's definitely all because you are trying to compare a Promise with a boolean. Doesn't mean that you shouldn't do the first thing anyways :)

Upvotes: 2

atomrc
atomrc

Reputation: 2583

Well the problem is that you are directly comparing the returned promise with a boolean we you do Provider.checkPath() === true.

As a promise is simply a wrapper for a value, in order to get the value contained in the promise (in your case the boolean) you need to use the then method.

The code would look like that

this.Provider.checkPath().then(function (value) {
  // 'value' is your boolean
})

BTW, yes, using a Promise was a very good idea, this is exactly the use case for them :)

Upvotes: 0

Related Questions