CODEWITHSUNDEEP
angulartypescriptionic2ionic3side-menu
cat1244
cat1244

Reputation: 69

Sidemenu stops working

I created the Ionic application from the menu

ionic start myApp sidemenu

On one of the pages there will be a test, and I want that after the end of the test there is a mandatory page with a comment. With which the user could not get anywhere, until he filled out the comment.

I created a test page and a comment page

I decided to use the Modals

On the test page there is a button that opens a page of comments

finishTest() {
    let modal = this.modalCtrl.create('CommentPage');
    modal.present();
}

On the comments page, I want to go to the main page after sending

constructor(public navCtrl: NavController, public viewCtrl: ViewController) {}

onSubmit(form: NgForm) {
  this.navCtrl.setRoot(HomePage);
}

The problem is that when I turn to the main page my sidemenu stops working.

Has anyone been confronted with this problem? How can it be solved? Can you use something else instead of Modals?

Upvotes: 2

Views: 64

Answers (2)

Utpaul
Utpaul

Reputation: 2007

You need to change in CommentPage

constructor(public navCtrl: NavController, public viewCtrl: ViewController,public appCtrl: App) {}

onSubmit(form: NgForm) {
  this.appCtrl.getRootNav().setRoot(HomePage);
}

I think your problem will be solve...

Upvotes: 0

sebaferreras
sebaferreras

Reputation: 44669

The issue with your code is that when you open a page as a Modal, that modal has its own navigation stack. So when you do this.navCtrl.setRoot(HomePage); inside of the modal, you're actually setting that page as the root page of the navigation stack from the modal, where the side menu does not work.

In order to fix that, you'd need to get a reference of the root NavController in your app, like this:

import { Component } from '@angular/core';
import { App } from 'ionic-angular';

@Component({... })
class YourModalPage {

  constructor(public appCtrl: App, ...) {}

  pushPage() {
    this.appCtrl.getRootNav().push(HomePage);
  }

  setPageAsRoot() {
    this.appCtrl.getRootNav().setRoot(HomePage);
  }

}

You can find some more information about working with different navigation stacks here.

Upvotes: 1

Related Questions