CODEWITHSUNDEEP
angulartypescriptionic-frameworkionic2
Philip7899
Philip7899

Reputation: 4677

navpush not working in ionic 2

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

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:

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

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

  constructor() {

  }
}

and here is the 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

Upvotes: 3

Views: 3032

Answers (1)

Sam5487
Sam5487

Reputation: 679

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.

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

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.

  1. 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.
  2. Builds are now always development (non-AoT) by default. To enable prod builds, use the --prod option.

Taken from Ionic 2 Chanelog

Upvotes: 3

Related Questions