How to change pages on Ionic V2

Asked

Viewed 3,010 times

0

Good morning, you guys, I have a question, of beginner, that I created two pages in Ionic v2 but I do not know how to navigate between one and the other. Looking at the documentation of Ionic I saw this navController adapted the code he gave but did not work.

login.html

<ion-footer>
<ion-toolbar>
    <p>Nao e cadastrado? <button ion-button clear (click)="pushPage()">cadastre-se</button>
    </p>

login ts.

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams, LoadingController,App, ViewController } from 'ionic-angular';
import { RegisterPage } from '../register/register';
/**
 * Generated class for the LoginPage page.
 *
 * See http://ionicframework.com/docs/components/#navigation for more info
 * on Ionic pages and navigation.
 */
@IonicPage()
@Component({
  selector: 'page-login',
  templateUrl: 'login.html',
  })


export class LoginPage {

  constructor(	public navCtrl: NavController,
   				public navParams: NavParams,
   				public loadingCtrl: LoadingController,
   				public viewCtrl: ViewController,
   				public appCtrl: App) {
  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad LoginPage');
  }

  presentLoading() {
    this.loadingCtrl.create({
      content: 'Por favor aguarde...',
      duration: 3000,
      dismissOnPageChange: true
    }).present();
  }

  	pushPage() {
	    this.viewCtrl.dismiss();
	    this.appCtrl.getRootNav().push(RegisterPage);
	}

}

ERROR: Runtime Error Uncaught (in promise): navigation stack needs at least one root page

ionic angular ionic2

2 answers

2


If you want the next page to have the option to go back to the top of the screen, use:

import { NavController } from 'ionic-angular';

constructor(public navCtrl: NavController) {}

goToPage() {
   this.navCtrl.push(NoticiaPage);
}

If you want to leave the next screen as the main one, use:

import { NavController } from 'ionic-angular';

constructor(public navCtrl: NavController) {}

goToPage() {
   this.navCtrl.setRoot(SolicitacaoCodigoPage);
}

1

Try this:

pushPage() {
    this.navCtrl.pop();
    this.navCtrl.push(RegisterPage);
}

Also check if the page is defined in app.module.ts

Browser other questions tagged ionic angular ionic2

You are not signed in. Login or sign up in order to post.