使用模态
模式在屏幕外滑动以显示临时 UI,通常用于登录或注册页面,消息撰写和选项选择。
import { ModalController } from 'ionic-angular';
import { ModalPage } from './modal-page';
export class MyPage {
constructor(public modalCtrl: ModalController) {
}
presentModal() {
let modal = this.modalCtrl.create(ModalPage);
modal.present();
}
}
注意:模态是一个覆盖用户当前页面的内容窗格。
通过模态传递数据
数据可以通过 Modal.create()
作为第二个参数传递给新模态。然后可以通过注入 NavParams
从打开的页面访问数据。请注意,作为模态打开的页面中没有特殊的模态逻辑,但使用 NavParams
与标准页面没有区别。
第一页:
import { ModalController, NavParams } from 'ionic-angular';
export class HomePage {
constructor(public modalCtrl: ModalController) {
}
presentProfileModal() {
let profileModal = this.modalCtrl.create(Profile, { userId: 8675309 });
profileModal.present();
}
}
第二页:
import { NavParams } from 'ionic-angular';
export class Profile {
constructor(params: NavParams) {
console.log('UserId', params.get('userId'));
}
}