离子提示在显示消息之前未获得价值

时间:2019-04-06 10:10:17

标签: asynchronous async-await ionic4

我正在尝试通过getTask(taskId)获取数据后通过ion-alert显示一些消息。 但是似乎它在返回数据之前显示了警告对话框,因此this.item中的message显示了undefined

如何在显示警告对话框之前确保返回数据?

list.page.ts

  items: Array<any>;
  item: any;

  constructor(
    public loadingCtrl: LoadingController,
    private authService: AuthService,
    private router: Router,
    private route: ActivatedRoute,
    private firebaseService: FirebaseService,
    private alertCtrl: AlertController,
  ) { }

  async delete(clickedItem: any) {
    let itemId = clickedItem.payload.doc.id;
    this.firebaseService.getTask(itemId)
            .then(data => {
                this.item = data;
            }, err => {
                console.log(err);
            });

    const alert = await this.alertCtrl.create({
      header: 'Confirm',
      // this.item is undefined here
      message: 'Do you want to delete ' + this.item.title + '?',
      buttons: [
        {
          text: 'No',
          role: 'cancel',
          cssClass: 'secondary',
          handler: () => {}
        },
        {
          text: 'Yes',
          handler: () => {
            this.firebaseService.deleteTask(itemId)
            .then(
              res => {
                this.router.navigate(["/list"]);
              },
              err => console.log(err)
            )
          }
        }
      ]
    });
    await alert.present();
  }

firebase.service.ts

getTask(taskId){
    return new Promise<any>((resolve, reject) => {
      this.afAuth.user.subscribe(currentUser => {
        if(currentUser){
          this.snapshotChangesSubscription = this.afs.doc<any>('people/' + currentUser.uid + '/tasks/' + taskId).valueChanges()
          .subscribe(snapshots => {
            resolve(snapshots);
          }, err => {
            reject(err)
          })
        }
      })
    });
  }

1 个答案:

答案 0 :(得分:1)

尝试一下:

  async delete(clickedItem: any) {
    let itemId = await clickedItem.payload.doc.id;
    await this.firebaseService.getTask(itemId)
            .then(data => {
                this.item = data;
            }, err => {
                console.log(err);
            });

    const alert = await this.alertCtrl.create({
      header: 'Confirm',
      // this.item is undefined here
      message: 'Do you want to delete ' + this.item.title + '?',
      buttons: [
        {
          text: 'No',
          role: 'cancel',
          cssClass: 'secondary',
          handler: () => {}
        },
        {
          text: 'Yes',
          handler: () => {
            this.firebaseService.deleteTask(itemId)
            .then(
              res => {
                this.router.navigate(["/list"]);
              },
              err => console.log(err)
            )
          }
        }
      ]
    });
    await alert.present();
  }

或者您也可以尝试

async delete(clickedItem: any) {
        let itemId = await clickedItem.payload.doc.id;
        this.firebaseService.getTask(itemId)
                .then(async data => {
                    this.item = data;
 const alert = await this.alertCtrl.create({
          header: 'Confirm',
          // this.item is undefined here
          message: 'Do you want to delete ' + this.item.title + '?',
          buttons: [
            {
              text: 'No',
              role: 'cancel',
              cssClass: 'secondary',
              handler: () => {}
            },
            {
              text: 'Yes',
              handler: () => {
                this.firebaseService.deleteTask(itemId)
                .then(
                  res => {
                    this.router.navigate(["/list"]);
                  },
                  err => console.log(err)
                )
              }
            }
          ]
        });
        await alert.present();
                }, err => {
                    console.log(err);
                });

      }