Ionic3.x 中的路由导航NavController以及 路由传值

如果从页面A跳转到页面B并传参,有两种方法:

NavController 路由跳转传参

A.ts中的代码

this.navCtrl.push(ArticlePage , { 
  id: "123", 
  name: "Carl" 
});

B.ts
引入 NavParmas 模块

import { NavParams } from 'ionic-angular';
constructor(private navParams: NavParams) {
  let id = this.navParams.get('id'); 
  let name = this.navParams.get('name');
}

通过属性路由跳转传参

A页面定义数据

public pushPage:any;
  public params:any;

  constructor(public navCtrl: NavController) {
    this.pushPage = NewsPage;
    this.params = {msg:"传递的参数"};
  }

A.html中绑定跳转的页面和参数


目标B页面得到数据

public text:any;
  constructor(public navCtrl: NavController, public navParams: NavParams) {
    this.text = this.navParams.get('msg');
  }

你可能感兴趣的:(Ionic3.x 中的路由导航NavController以及 路由传值)