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 –
现在我已经实现了我想要。你是我的救星,非常感谢你 –
不客气! –