Burger-menu dissapears when using setRoot to change page


#1

Hello,

I added a burger menu to my project and I would like to see it on every page I visit, but it disapears.

I tried to make a clear example of the problem:

  1. made a new project
  2. created 2 pages: page1 and page2
  3. created 1 component: switch-page

page1 and page2.html looks like:

<ion-header>
  <ion-navbar>
    <ion-title>Page 2</ion-title>
    <button ion-button menuToggle>
      <ion-icon name="menu"></ion-icon>
    </button>
  </ion-navbar>
</ion-header>
<ion-menu [content]="content2">
<ion-content>
    hello
</ion-content>
</ion-menu>
<ion-nav #content2></ion-nav>
<ion-content padding>
  this is page 2
  <switch-page selectedPage="Page2"></switch-page>
</ion-content>

the switch page component is really simple:

<button type="button" (click)="activePage()">switch page</button>

import { Component, Input } from '@angular/core';
import { NavController, NavParams, LoadingController } from 'ionic-angular';
import { Page1Page } from '../../pages/page1/page1';
import { Page2Page } from '../../pages/page2/page2';

@Component({
  selector: 'switch-page',
  templateUrl: 'switch-page.html'
})
export class SwitchPageComponent {

  text: string;
  @Input() selectedPage: string;

  constructor(public navCtrl: NavController,
    public navParams: NavParams,
    public loading: LoadingController) {
  }

  public activePage(): Promise<void> {
    let loader = this.loading.create();
    loader.present();
    if (this.selectedPage === "Page2") {
      return this.navCtrl.setRoot(Page1Page).then(() => loader.dismiss());
    }
    else {
      return this.navCtrl.setRoot(Page2Page).then(() => {
        loader.dismiss()
        console.log(this.navCtrl.getActive())
      });
    }
  }
}

As you can see in the gif, the burger menu disapears when I setRoot… How to fix that ?
I’m searching the web since yesterday and I think I’ve read every topic about menuToggle on ionic forum without finding a solution to my problem.
Thank you. I can send source code if needed but I don’t think it’s necessary as there is almost no code !


#2

if you can’t see the gif, i can send a video


#3

I forgot to mention that I’m using Ionic 3 and angular 4, this might be a bug. Should I open an issue on Github?


#4

I’m not sure that this design is the clearest way to deal with navigation, but that aside, have you read the section about persistence in the Menu docs?


#5

Hello,
I tried, but it has no apparent effect.
I read on the doc: "Persistent menus display the MenuToggle button in the Navbar on all pages in the navigation stack."
I think that persistent menu is only for “pushed” pages…


#6

Should I open an issue github ?