Ionic 4 alert

1.導入：

import { AlertController } from '@ionic/angular';

2.在溝槽函數裏面聲明：

constructor(public alertController: AlertController) {}

3.添加幾個點擊按紐：

<ion-button (click)="presentAlert()">
支付
</ion-button>
<ion-button (click)="presentAlertMultipleButtons()">
刪除
</ion-button>

<ion-button (click)="presentAlertPrompt()">
添加信息
</ion-button>

4.點擊事件裏面寫代碼：

async presentAlert() {
const alert = await this.alertController.create({
   header: '提示信息',
   message: '支付成功',
   buttons: ['OK']
});
await alert.present();
}
async presentAlertMultipleButtons() {
    const alert = await this.alertController.create({
    header: '提示信息!',
    message: '您確定要刪除嗎',
    buttons: [
{
    text: '取消',
    role: 'cancel',
    cssClass: 'secondary',
    handler: (blah) => {
    console.log('Confirm Cancel: blah');
}
}, {
    text: '確定',
    handler: () => {
    console.log('Confirm Okay');
    }
    }
]
});
    await alert.present();
}

  async presentAlertPrompt() {
const alert = await this.alertController.create({
  header: '請輸入信息',
  inputs: [
{
  name: '姓名',
  type: 'text',
  placeholder: '請輸入姓名'
},
{
  name: '卡號',
  type: 'text',
  id: 'name2-id',
  value: 'hello',
  placeholder: '請輸入卡號'
},
{
  name: '密碼',
  type: 'url',
  placeholder: '請輸入密碼'
},
// input date with min & max
{
  name: '出生日期',
  type: 'date',
  min: '1900-03-01',
  max: '2019-08-25'
},
// input date without min nor max
{
  name: '年齡',
  type: 'number',
  min: 0,
  max: 109,
  placeholder: '請輸入年齡'
},
{
  name: '手機號',
  type: 'number',
  placeholder: '請輸入手機號'
}
],
buttons: [
{
  text: '取消',
  role: 'cancel',
  cssClass: 'secondary',
  handler: () => {
 console.log('Confirm Cancel');
}
}, {
  text: '確定',
  handler: () => {
  console.log('Confirm Ok');
  }
  }
]
});
   await alert.present();
}