javascript - Ionic 和 Angular - 可重复使用的 'next page' 按钮

Question

我正在使用 Angular 和 Ionic 3 构建一个游戏，由于该游戏有很多页面/ View ，我想避免在有按钮的页面的 ts 文件中编写相同的代码。

我的问题如下，是否可以创建一个“可重用”按钮将当前 View 移动到另一个 View ？我所说的“可重用”是指在 app.ts 中声明按钮单击函数并从 HTML 动态更改目标页面。

到目前为止我做了什么:

在 home.html

<button ion-button color="light" (click)="moveToPage(gameSettings)">One Player</button>

注意:我想要访问的页面类是“gameSetting”，它是我的项目的一部分，位于/pages/game-settings/

在app.ts中

constructor(public navCtrl: NavController, public navParams: NavParams) {
    moveToPage(pageName: String)
    {
        this.navCtrl.push(pageName);
    }
}

不幸的是，这不起作用!发生的情况是 HTML 将“pageName”作为具有 undefined 类型的变量传递，即它会引发错误。 Ionic 的 navCtrl 页面仅解释了如何通过 this.navCtrl.push() 函数中明确的页面名称移动到另一个页面。 https://ionicframework.com/docs/api/navigation/NavController/

任何有关此行为的帮助将不胜感激。

Answer 1

您只需将 (click)="moveToPage(gameSettings)" 更改为 (click)="moveToPage('gameSettings')"。只是缺少 ''