javascript - 如何导航到用户提供的页面

Question

我正在构建一个新应用程序，并希望在主屏幕上添加功能。用户输入一个值，我会带他到页面，

例如，插入值 1 将转到第 1 页，依此类推...

标签： javascriptionic-frameworkangular2-routing

Answer 1

如果您不想使用模态，只需正确更改以下代码即可。

模板页面.ts

// skip import
@IonicPage(//skip)
@Component(//skip)
export class TemplatePage{
  pageNumber:number;
  data:string;

  constructor(
    private navParams:NavParams
  ){
    this.data = this.navParams.get('data')
    this.pageNumber = this.navParams.get('pageNumber')
  }
}

模板页面.html

<ion-header>
  <p>page {{pageNumber}}</p>
</ion-header>
<ion-content>
  {{data}}
</ion-content>

主页.ts

// skip import
@IonicPage(//skip)
@Component(//skip)
export class HomePage{
  constructor(
    private modalCtrl:ModalController
  ){}

  public openPage(pageNumber:number, data:string){
    this.modalCtrl.create('TemplatePage',{pageNumber:pageNumber,data:data}).present()
  }
}