Ionic 4 - AlertController: 属性 'present' 不存在 - Angular?

Ionic 4 - AlertController: Property 'present' does not exist - Angular?

我正在 Ionic 4 中设置新警报 - 空白 type:angular 项目。 这是基本警报,但我的项目发生错误 运行。

错误

属性 'present' 在类型 'Promise' 上不存在。你忘记使用 'await' 了吗?

我创建了与文档中相同的代码。友情链接:https://ionicframework.com/docs/api/components/alert/AlertController/

我的代码:

import { AuthenticationService } from './../../services/authentication.service';
import { Component, OnInit } from '@angular/core';
import { AlertController, LoadingController, NavController } from 
'@ionic/angular';

@Component({
  selector: 'app-register',
  templateUrl: './register.page.html',
  styleUrls: ['./register.page.scss'],
})
export class RegisterPage implements OnInit {
  createSuccess = false;
  registerCredentials = { email: '', password: '' };

 constructor(
   private nav: NavController,
   private auth: AuthenticationService,
   private alertCtrl: AlertController) { }

 ngOnInit() {
 }

 presentAlert() {
    const alert = this.alertCtrl.create({
    message: 'Low battery',
    subHeader: '10% of battery remaining',
    buttons: ['Dismiss']
   });
   alert.present(); <--- error Property 'present' does not exist on type 'Promise<HTMLIonAlertElement>'. Did you forget to use 'await'?
}
public register() {
this.auth.register(this.registerCredentials).subscribe(success => {
  if (success) {
    this.createSuccess = true;
    this.showPopup('Success', 'Account created.');
  } else {
    this.showPopup('Error', 'Problem creating account.');
  }
},
  error => {
    this.showPopup('Error', error);
  });
}

showPopup 功能,应该工作..

showPopup(title, text) {
let alert = this.alertCtrl.create({
  message: title,
  subHeader: text,
  buttons: [
    {
      text: 'OK'
    }
  ]
});
alert.present(); <-- the same error
}

您使用的文档是指ionic 3 由于您正在使用 Ionic 4,因此您需要参考当前的 Ionic 4 docs and this

this.alertController.create({...})

returns 错误指定对象的承诺。

您的代码需要:

 async presentAlert() {
    const alert = await this.alertCtrl.create({
    message: 'Low battery',
    subHeader: '10% of battery remaining',
    buttons: ['Dismiss']
   });
   await alert.present(); 
}

由于警报控制器的创建方法return promise 这就是为什么您不能直接使用当前方法的原因。您需要做的是 "use then" 并像下面这样调用当前方法-

presentAlert() {
  const alert = this.alertCtrl.create({
  message: 'Low battery',
  subHeader: '10% of battery remaining',
  buttons: ['Dismiss']}).then(alert=> alert.present());
}

希望对您有所帮助:)。

您必须使用 asyncawait。这是一个代码示例:

 async showAlert () {
  const alert = await this.alertCtrl.create({
    header: 'Alert',
    subHeader: 'Subtitle',
    message: 'This is an alert message.',
    buttons: ['okay']
  });
  await alert.present();
};

我已经用这个解决方案解决了..

这样写alert.present()(await alert).present()

async presentAlert() {
    let alert = this.alertCtrl.create({
      subHeader: 'Low battery',
      message: 'This is an alert message.',
      buttons: ['Dismiss']
    });
    (await alert).present();
  }