Я хочу получить данные баланса из firebase. Но это должно быть в режиме реального времени.

Я пишу код ниже. Вывод на консоль — «Баланс: 0». После этого вывода он получает данные firebase и записывает их. Итак, перед тем, как данные поступают из firebase, код продолжается, и функция get balance возвращает 0. Из-за этого я не могу сравнить баланс. Фактические данные поступают после этого.

 checkBalance() {
    let balance = this.authService.getBalance()
    result = this.authService.getBalance() >= this.price ? true : false
    console.log("Balance: "   balance);
    return resu<
}
  

AuthService:

 getBalance() {
    
    let docRef = this.angularFirestore.collection(`users`).doc(JSON.parse(localStorage.getItem('user')).uid);
    docRef.get().toPromise().then(function (doc) {
        if (doc.exists) {
            console.log(doc.data());
            console.log(doc.data().balance);
            return parseFloat(doc.data().balance);
        } else {
            // doc.data() will be undefined in this case
            console.log("Doc can not find!");
            return 0.0;
        }
    }).catch(function (error) {
        console.log("Error getting document:", error);
        return 0.0;
    });
    
    return 0.0;
}
  

Оригинальный ответ

Шаги

1. Отметьте getBalance метод async и сделайте его return своим обещанием
2. checkBalance Метод метки async
3. Измените первую строку следующим образом: let balance = await this.authService.getBalance()

Пример

 async getBalance() {
    const docRef = this.angularFirestore.collection(`users`).doc(JSON.parse(localStorage.getItem('user')).uid);

    return docRef.get().toPromise().then(function (doc) {
        if (doc.exists) {
            console.log(doc.data());
            console.log(doc.data().balance);
            return parseFloat(doc.data().balance);
        } else {
            // doc.data() will be undefined in this case
            console.log("Doc can not find!");
            return 0.0;
        }
    }).catch(function (error) {
        console.log("Error getting document:", error);
        return 0.0;
    });
}
  

 async checkBalance() {
    const balance = await this.authService.getBalance();
    const result = balance >= this.price ? true : false;
    console.log("Balance: "   balance);

    return resu<
}
  

Ссылка на JS

• https://javascript.info/async-await

Обновление для Angular 12 или выше

Устаревание toPromise в rxjs 7

Теперь вместо toPromise вы должны использовать lastValueFrom или firstValueFrom из rxjs

 
import { firstValueFrom} from "rxjs";
async getBalance() {
    const docRef = this.angularFirestore.collection(`users`).doc(JSON.parse(localStorage.getItem('user')).uid);

    return firstValueFrom(docRef.get()).then(function (doc) {
        if (doc.exists) {
            console.log(doc.data());
            console.log(doc.data().balance);
            return parseFloat(doc.data().balance);
        } else {
            // doc.data() will be undefined in this case
            console.log("Doc can not find!");
            return 0.0;
        }
    }).catch(function (error) {
        console.log("Error getting document:", error);
        return 0.0;
    });
}
  

Ссылка на Rxjs

• https://rxjs.dev/deprecations/to-promise