1.新建new-page页面
1.1在控制台
|
1 |
ionic g page NewPage |
1.2在app.module.ts配置
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
import { NewPagePage } from '../pages/new-page/new-page'; @NgModule({ declarations: [ MyApp, Hello， NewPagePage ], imports: [ IonicModule.forRoot(MyApp) ], bootstrap: [IonicApp], entryComponents: [ MyApp, Hello, NewPagePage ], providers: [] }) |
2.从hello页面跳转到new-page页面
2.1在hello.html页面添加button
|
1 2 3 |
<button class="hello-ionic-btn" (click)="testNewPage()"> <ion-icon name="menu"></ion-icon> </button> |
2.2在hello.ts
|
1 |
import { NewPagePage } from '../new-page/new-page'; |
|
1 2 3 4 5 6 7 8 9 |
constructor(public navCtrl: NavController) { } testNewPage(){ console.log('点我了'); this.navCtrl.push(NewPagePage,{ item1:'ios-newPage' }); } |
3.在新页面取值
|
1 |
import { NavController,NavParams } from 'ionic-angular'; |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
export class NewPagePage { data:any; constructor(public navCtrl: NavController,public navParams: NavParams) { this.data = navParams.get('item1') console.log(this.data); } ionViewDidLoad(navParams: NavParams) { console.log('Hello NewPagePage Page'); console.log(this.data); } } |