Ionic 2警报定制

Question

我想在Ionic 2中自定义警报.我知道我可以在variables.scss中全局完成,但我想在特定页面中修改特定的警报.

我在警报代码中尝试了cssClass,我尝试了其他不同的东西,但是在全局范围内,而不是特定的.

有什么办法吗？

Answer 1

编辑所有AlertController.create方法,如下所示:

const alert = this.alertCtrl.create({
    title: title,
    subTitle: msg,
    buttons: ['OK'],
    cssClass: 'alertCustomCss' // <- added this
});

并将其添加到app.scss:

.alertCustomCss {
    // text color for basic alerts
    color: white; 

    // alert modal page bg color. Warning this will remove the alert transparency
    background-color: color($colors, dark, base); 

    button {
        color: white !important; // button text color
        background-color: color($colors, secondary, base) !important;
            //button bg color
    }

    .alert-message {
        color: white; // text color for confirm alerts
    }

    .alert-wrapper {
        background-color: color($colors, dark, base); // bg color of alert content
    }
  }