CODEWITHSUNDEEP
angulartypescriptionic2
deep dalvi
deep dalvi

Reputation: 155

how to show a page from a component in ionic2

I have create a component in the "src" directory.In this component there is a function trigged when a button is click in the HTML.In this function i want to call a ionic page(test page). Since ionic 2 maintains a stack to show pages using NavController and its pop,push..etc method ,error is show when i use .push() method from component. I have done all the imports,linked the page in app.module.ts declarations array and entryComponents array.This is the error msg

ERROR Error: StaticInjectorError[NavController]: StaticInjectorError[NavController]: NullInjectorError: No provider for NavController!

Im unable to find any solution

component code

import { NavController,Platform, DomController, ActionSheetController, 
Events, Slides  } from 'ionic-angular';
import { Component, ViewChild } from '@angular/core';
import { IonPullUpFooterState } from 'ionic-pullup';
import {mytestPage} from '../../pages/mytest/mytest';

@Component({
   selector: 'pull-up-drawer',
   templateUrl: 'pull-up-drawer.html'
})

export class PullUpDrawerComponent {
    constructor(public events: Events, public actionSheetCtrl: 
    ActionSheetController,public navCtrl:NavController) {}

    //when button click from html
    buttonClick(){
       this.navCtrl.push(mytestPage);
    }
}

Upvotes: 0

Views: 359

Answers (1)

yash_DedSec
yash_DedSec

Reputation: 251

This thing is not working as you cannot inject navController to a root page.

Try doing this:

constructor(public events: Events, public actionSheetCtrl: 
ActionSheetController,public app: App) {}


buttonClick(){
   this.app.getRootNav().push(mytestPage);
}

Well this is one method. If this does not work:

Do this in HTML ie pull-up-drawer.html

<ion-nav [root]="rootPage"></ion-nav>

In your .ts file set rootPage = mytestPage;

Hope it helps!

Upvotes: 2

Related Questions