bất đồng bộ - các hàm bất đồng bộ lồng nhau trong TypeScript

profile.page.ts:

  username: string;
  totalScore: number;
  ...


  loadUserData() {
    this.spinnerDialog.show();
    this.firebaseServie.loadUserData().then(() => {
      this.username = this.sessionData.getUser().getUsername();
      this.totalScore = this.sessionData.getUser().getTotalScore();
       ....
    });

firebase.service.ts:

async loadUserData() {
    console.log(this.sessionData.getUser().getEmail());
    this.userCollection = this.afs.collection('users', ref => ref.where('email', '==', this.sessionData.getUser().getEmail().toLowerCase()));

    this.userDoc = this.afs.collection("users").doc(this.sessionData.getUser().getEmail().toLowerCase());

    this.x = this.userDoc.valueChanges().subscribe(((item: User) => {
      this.userLoadedUser = item;
      console.log("Found user by email id " + this.sessionData.getUser().getEmail() + ":" + this.userLoadedUser.username);
      this.sessionData.getUser().setUsername(this.userLoadedUser.username);
      this.sessionData.getUser().setTotalScore(this.userLoadedUser.totalScore);
      ....

    }));
  }

Vậy làm sao tôi có thể chắc chắn rằng phần trong mệnh đề then() chỉ được thực thi sau khi chúng ta có dữ liệu từ Firebase?

Tôi đã chỉnh sửa câu hỏi của mình để dễ hiểu hơn.

Câu trả lời #1

Bạn có thể đơn giản trả về một Promise mới trong firebase.service.ts của bạn:

loadUserData() {
    return new Promise((resolve, reject) => {
        ...
        this.x = this.userDoc.valueChanges().subscribe(((item: User) => {
            ...
            resolve(); // If everything worked!
        }));
        ...
    });
}

Tôi hy vọng điều đó sẽ giúp ích!

Câu trả lời #2

Vì subscribe chỉ ra rằng bạn đang xử lý một observable, tốt hơn là đừng bắt đầu trộn với một promise, mà chỉ đơn giản sử dụng observable và pipe

otherfunc()
    .pipe(map(myfunc))
    .subscribe((item:User) => {

});

Nếu bạn thực sự muốn có lời hứa, bạn có thể chuyển observable thành một lời hứa.

otherfunc().toPromise().then(myfunc).then(e => {
    // runs after
});