navpush 在 ionic 2 中不起作用答案

【问题标题】：navpush not working in ionic 2navpush 在 ionic 2 中不起作用
【发布时间】：2016-10-06 15:09:56
【问题描述】：

我正在尝试在 Ionic 2 中做一些基本的路由。这是我的代码：

import { Component } from '@angular/core';

import { NavController } from 'ionic-angular';

import {FishPage} from '../fish';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  goFish: FishPage;
  constructor(public navCtrl: NavController) {
    this.goFish = FishPage;
  }

}

这里是 FishPage：

import { Component } from '@angular/core';

@Component({
  templateUrl: 'fish.html'
})
export class FishPage {

  constructor() {

  }
}

这里是html：

<ion-content>
    <button ion-button full [navPush]="goFish" >Go Fish</button>
</ion-content>

但是，当我点击按钮时，我收到以下错误：

例外：./HomePage 类 HomePage 中的错误 - 内联模板：16:2 原因：未找到 FishPage 的组件工厂

【问题讨论】：

你能发布你的 app.module 文件吗？那里的声明可能有问题。
谢谢，实际上我只是通过将 FishPage 添加到 app.module 来解决这个问题。我想我的问题真的是：app.module 是做什么的？它不在任何离子文档中。
您能否确保 FishPage 包含在您的 app.modules.ts 页面上的“声明”和“入口组件”中？

标签： angular typescript ionic-framework ionic2

【解决方案1】：

您要确保您的 FishPage 和所有其他内容都包含在 app.module 文件的声明和 entryComponents 中。该文件的目的只是事先声明/表示应用程序使用的所有组件、提供程序、指令或管道。然后将模块加载到 app/main.dev.ts 或 app/main.prod.ts 中。

由于 Ionic 2 利用了 Angular 2，请查看 Angular 2 的文档。

这些指南详细介绍了 Angular 应用程序构建块的变化。

希望这会有所帮助！

编辑：

关于我原来的回答中提到的 app/main.dev.ts 和 app/main.prod.ts 的变化。

main.dev.ts 和 main.prod.ts 已被弃用，取而代之的是具有 main.dev.ts 内容的 main.ts。 main.ts 的内容将在构建时针对生产构建进行优化。

默认情况下，构建现在始终是开发（非 AoT）。要启用 prod 构建，请使用 --prod 选项。

Taken from Ionic 2 Chanelog

【讨论】：