实现效果
点击右侧的小星星跳转
代码案例
页面文件html
<ion-icon name="star" class="iconScan" (click)="showScan()"></ion-icon>
页面ts
跳转方法及传参 this.navCtrl.push(‘跳转的页面’,{param:‘跳转的参数’})
showScan(){
this.navCtrl.push('BranchScanPage',{title:this.projectInfo.projectName})
}
angular4新建路由
ionic g page branchScan --pagesDir src/pages
所要跳转的页面 branch-scan html
<ion-header>
<ion-navbar>
<ion-title>{{title}}</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
</ion-content>
所要跳转的ts
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-branch-scan',
templateUrl: 'branch-scan.html',
})
export class BranchScanPage {
title:string;
constructor(public navCtrl: NavController, public navParams: NavParams) {
this.title=this.navParams.get('title');
}
ionViewDidLoad() {
console.log('ionViewDidLoad BranchScanPage');
}
}