1
A
回答
1
您可以使用自定義的類名的離子態,讓你覆蓋的CSS只爲這個彈出
打開彈出:
openModal() {
let modal = this.modalCtrl.create(CustomPopup,{},{showBackdrop:true, enableBackdropDismiss:true});
modal.present();
}
組件在模式中使用:
import { Component, Renderer } from '@angular/core';
import { ViewController } from 'ionic-angular';
@Component({
selector: 'custom-popup',
templateUrl: 'custom-popup.html'
})
export class CustomPopup {
text: string;
constructor(public renderer: Renderer, public viewCtrl: ViewController) {
this.renderer.setElementClass(viewCtrl.pageRef().nativeElement, 'custom-popup', true);
}
}
andfinaly the SCSS:
ion-modal.custom-popup ion-backdrop {
visibility: visible !important;
z-index:0;
}
ion-modal.custom-popup .modal-wrapper{
top: 20%;
width:60%;
height:300px;
position:absolute;
}
0
您可以添加創建如下自定義控制器 -
import { AlertController } from 'ionic-angular';
constructor(private alertCtrl: AlertController) {
}
presentAlert() {
let alert = this.alertCtrl.create({
title: 'Low battery',
subTitle: '10% of battery remaining',
cssClass: 'my-class',
buttons: ['Dismiss']
});
alert.present();
}
<style>
.my-class{
background: gray;
color:#333;
}
</style>
上,您可以添加自定義樣式相同的方式。你可以得到完整的例子 - https://www.tutorialsplane.com/ionic-popup
相關問題
- 1. 創建自定義對話框
- 2. 以mfc創建自定義對話框
- 3. 如何創建自定義對話框
- 4. 在Sitecore中創建自定義對話框的選項
- 5. 在Android中創建自定義對話框
- 6. 在Android中創建自定義對話框
- 7. 如何在InstallShield中創建自定義對話框?
- 8. 如何在vscode中創建自定義對話框?
- 9. 在黑莓中創建一個自定義輸入對話框
- 10. 如何在創建之前殺死自定義對話框?
- 11. 在android上創建自定義格式的對話框
- 12. 在android中的自定義對話框?
- 13. 在Ionic 2中,如何創建使用離子組件的自定義組件?
- 14. 在Ionic 2中,如何創建使用離子組件的自定義指令?
- 15. 取代facebook對話框中的自定義對話框在android
- 16. 自定義對話框
- 17. 自定義對話框Android
- 18. Android自定義對話框
- 19. android自定義對話框
- 20. iOS自定義對話框
- 21. 自定義onbeforeunload對話框
- 22. Wix自定義對話框
- 23. beforeunload自定義對話框
- 24. Android自定義對話框
- 25. 自定義字體離子2
- 26. 離子2 googlemaps自定義控件
- 27. 創建一個返回參數的自定義對話框
- 28. 創建自定義fltk對話框/模態窗口
- 29. WiX編譯錯誤創建自定義對話框
- 30. PyQt4:創建一個返回參數的自定義對話框
謝謝你回答這個問題,我得到一些問題=>你在哪裏創建modalCtrl –
現在我已經實現了我想要。你是我的救星,非常感謝你 –
不客氣! –