關於TypeScript頁面跳轉，事件監聽和數據傳遞

ionic3採用的是typescript寫法，頁面間跳轉的幾種方式。

頁面堆棧方式（NavController）

先進後出，後進先出，push()和pop()，在需要跳轉的頁面引入 NavController，
NavParams(跳轉帶過去的參數)，在跳轉到的頁面添加 NavParams 接收傳過來
的參數，一般頁面跳轉都帶有返回的按鈕，所以和pop()一樣，也可以調用
this.navCtrl.pop()返回前一頁面。

//跳轉頁面
import { NavController , NavParams } from 'ionic-angular';
export class HomePage {
  constructor(public navCtrl: NavController , 
              public navParams : NavParams ) {}

    //your codes...
    push(){
        this.navCtrl.push(xxx,{  //xxx代表跳轉到的頁面，以及傳遞的參數       
            "id" : 1,
            "name" : "Neo"                      
        })
    }
}

//跳轉到的頁面
import { NavParams } from 'ionic-angular';
export class xxx {
  id : number;
  name : string;
  constructor(public navParams : NavParams ) {

    //your codes...   類似鍵值對獲取數據
    this.id = this.navParams.get('id');
    this.name = this.navParams.get('name');
  } 
}

模態化窗口的形式（ModalController）

即一個小彈窗形式，modal跳轉也是頁面跳轉。
和NavController用法是一樣的，也可以傳遞參數到跳轉頁面，
獲取值的方式也是通過NavParams.get()；
不同在於設備大小而顯示的模態話窗口大小不一樣。需要引入ModalController。

import { ModalController } from 'ionic-angular';
export class HomePage {
  id : number;
  name : string;
  constructor(public modal: ModalController ) {

    //your codes...   
    let modal = this.modal.create(xxx,{ //xxx是要跳轉到的頁面
        "id" : 1,
        "name" : "Neo"
    }) ;
    modal.present();
  } 
}

---

事件發佈訂閱（Events）

有時候可能會反覆切換和跳轉頁面，反覆修改數據。
但是這時又想讓數據同步刷新在頁面上，
而且想所有頁面都共享所需數據
想只是局部刷新數據，而不是全局刷新，這時就需要用到（Events）事件的發佈和訂閱了。

參考官方例子 Events
發佈頁面：

import { Events } from 'ionic-angular';    //導入
...
export class EventsPage {
  user : string = 'Events';

  constructor(public events: Events) {}

  publishEvents(user) {
    console.log('User created!')
    this.events.publish('user:created',this.user, Date.now());
    console.log(this.user)
  }
}

要接收數據的頁面（訂閱頁面）：

import { Component} from '@angular/core';
import { Events } from 'ionic-angular';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
  myEvent : string;
  constructor(public events: Events) {
    var that = this; //避免作用域混淆
    events.subscribe('user:created', (user, time) => {
      //HomePage.prototype.myEvent = user; 
      that.myEvent = user;
    });
  }
}

Events is a publish-subscribe style event system for sending and responding to application-level events across your app.

注意：

訂閱必須在發佈之前，不然接收不到。像回調函數，先自己定義方法，當成功執行某件事件後觸發。
再通俗易懂點：比如微信公衆號，你要先關注才能接收到它的推文，不然它再怎麼發推文，你也收不到。也就是說，接收頁面必須在發佈頁面前被加載過。