在离子2中不工作。

I am trying to do some basic routing in Ionic 2. Here is my code:

我尝试在离子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;
  }

}

and here is FishPage:

这里是FishPage:

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

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

  constructor() {

  }
}

and here is the html:

这是html

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

However, when i click on the button I get the following error:

然而，当我点击按钮时，我得到了以下错误:

EXCEPTION: Error in ./HomePage class HomePage - inline template:16:2 caused by: No component factory found for FishPage

例外:错误在。/主页类主页-内联模板:16:2由:没有发现鱼页的组件工厂。

1 个解决方案

#1

You want to make sure that your FishPage and all others are included in declarations and entryComponents in app.module file. The purpose of this file is just to declare/represent before hand all the components, providers, directives or pipes that the application uses. Afterwards the module is then loaded into app/main.dev.ts or app/main.prod.ts.

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

Since Ionic 2 leverages Angular 2, take a look at Angular 2's documentation instead.

由于Ionic 2利用了角2，所以可以看一下角2的文档。

Angular 2 architecture guide
角2架构指南
Angular 2 ngModule guide
角2 ngModule指南

These guides go into detail of the changes in the building blocks for angular apps.

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

Hope this helps!

希望这可以帮助!

EDIT:

编辑:

Changes in regards to app/main.dev.ts and app/main.prod.ts that were mentioned in my original answer.

关于app/main.dev.ts和app/main.prod的更改。在我最初的回答中提到的ts。

main.dev.ts and main.prod.ts have been deprecated in favor of main.ts with the content of main.dev.ts. The content of main.ts will be optimized at build time for production builds.

main.dev.ts main.prod。ts已被弃用以支持main。ts的内容为main.dev.ts。主要的内容。ts将在构建时为生产构建优化。

Builds are now always development (non-AoT) by default. To enable prod builds, use the --prod option.

构建现在总是默认的开发(非aot)。要启用prod构建，请使用-prod选项。

Taken from Ionic 2 Chanelog

由Ionic 2 Chanelog拍摄。

#1