comment donner à Alert Controller css dans ionic 4?

Question

Je veux donner un style de contrôleur d'alerte dans ionic 4. c'est mon code de démonstration,

async presentalert() {
    const alert = await this.alertCtrl.create({
      header: '  DO YOU WANT TO CANCEL',
      message: 'DO YOU WANT TO CANCEL',
      cssClass: 'alertCancel',
      mode: 'ios',
      buttons: [
        {
          text: 'NO',
          role: 'cancel',
          cssClass: 'alertButton',
          handler: () => {
            console.log('Confirm Cancel');
          }
        }, {
          text: 'YES',
          cssClass: 'alertButton',
          handler: () => {
            console.log('Confirm Okay');
          }
        }
      ]
    })
    await alert.present();
  }

et j'ai essayé d'appliquer scss dans global.scss

 .alertCancel{
    --background: red;
  }
  .alertButton {
     background-color: white !important;
  }

J'ai essayé de toutes les manières possibles de donner des CSS dans le contrôleur d'alerte mais cela ne fonctionne pas, alors aidez-moi, je suis coincé ici.

Answer 1

Si vous souhaitez styliser votre alerte en utilisant cssClass au lieu du composant ion-alert alors ajoutez le code suivant à votre variables.scss

.alertCancel{
  --background: red;
    button.alertButton{
      color: white;
    }
 }

Résultat

Depuis, ion-alert ne fournit pas Propriétés personnalisées CSS pour styliser les boutons d'alerte. Je vous suggère d'utiliser défini cssClass pour styliser votre alerte plutôt que ion-alert lorsque vous souhaitez également styler vos boutons d'alerte.