ionic - 使用带有 navCtrl.push() 的参数

Question

我从 home.html 调用一个方法

(click)="openPage(EventsPage)"

我知道如果我只是使用这种方法

openPage() {
  this.navCtrl.push(EventsPage)
}

在 home.ts 中它会起作用。

基本上我想根据点击的内容采用不同的参数，但只使用一种方法导航到所选页面，例如

(click)="openPage(EventsPage)"
(click)="openPage(TimetablePage)"

openPage(page) { 
  this.navCtrl.push(page)
}

我只需要使用 switch 语句或 ifs 吗？我希望我能把它保持在一两行。

任何建议或意见表示感谢。

Answer 1

由于这似乎是一个您刚刚开始或摆弄的项目，这就是我的建议。

当您创建任何新页面时，请连同它们一起创建 page.module.ts。

典型的 page.module.ts 看起来像这样

import {IonicPageModule} from 'ionic-angular';
import {NgModule} from '@angular/core';
import {YourPage} from './your-page.ts';

@NgModule({
    declarations: [YourPage],
    imports: [IonicPageModule.forChild(YourPage)]
})
export class YourPageModule{}

这就是 your-page.ts 的样子

import {Component} from '@angular/core';
import {IonicPage} from 'ionic-angular';

@IonicPage()
@Component({
   selector: 'your-page',
   templateUrl: 'your-page.html'
})
export class YourPage{}

当您完成所有这些设置后，您只需将“YourPage”字符串发送到 openPage(page) 函数即可导航到 YourPage 组件。

通过 ionics NavController 推送字符串而不是导入的页面实例也启用延迟加载（页面的 js-bundle 在需要时获取，而不是在启动时一次全部获取）。如果您有一个包含许多页面的应用程序，这可以显着改善您的启动时间。我还建议阅读 IonicPage docs，它们在处理导航时非常有用。