我正在编写一个SOS页面,当我点击我希望它显示这样一个弹出页面的按钮时。然后用户可以选择电话号码。
sos.html页面
<button ion-button color="light" (click)="openSosPop()">Call</button>
sos.ts page
openSosPop() {
this.openModal('SosPopPage');
// let contactModal = this.modalCtrl.create(SosPopPage);
// contactModal.present();
}
openModal(pageName) {
this.modalCtrl.create(pageName, null, { cssClass: 'inset-modal' })
.present();
}
sos.css页面
ion-modal.inset-modal {
// transparent black background overlay
background-color: rgba(0, 0, 0, .5) !important;
transition: opacity .25s ease-in-out;
padding: 20vh 10vw;
}
答案 0 :(得分:1)
我没有使用延迟加载
如果您不使用延迟加载,则它不是IonicPage
。
添加IonicPage装饰器允许您使用字符串名称来处理页面。
这将使用与类名相同的名称自动创建指向MyPage组件的链接:&#39; MyPage&#39;。现在可以使用此名称导航到该页面。
由于您没有延迟加载,因此无法使用字符串来导航或创建模态和弹出窗口。您必须使用实际的页面/组件。
导入页面。
import <path_to_page>;
this.openModal(SosPopPage);//create the modal.