ionic2の画面遷移と遷移先に値を渡す

2016年12月09日

  1. TOP
  2. BLOG
  3. angular2
  4. ionic2の画面遷移と遷移先に値を渡す

Ionic2の画面遷移はどうやるのか?そして遷移先に値を渡す方法は?
という事で調べてみました

画面遷移と遷移先に渡す値の設定

constructor(public navCtrl: NavController) {
}

goList() {
    this.navCtrl.push(ListsPage, {index: "値"});
}

NavControllerのpush関数に遷移するページのコンポーネントを指定

引き渡す値はpushの第二引数にobject形式(key : value)で指定します
尚、コンポーネントはimportしておきましょう。

引き渡された値を取得する

constructor(public navCtrl: NavController, navParams: NavParams) {
    this.index = navParams.get("index");
}

getに取得するkey名を指定すると値が取得出来ます。
またimportにnavParamsの追記が必要です

import { NavController, NavParams } from 'ionic-angular';