使用模態

模式在螢幕外滑動以顯示臨時 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'));
 }

}