Side menu on different pages other than root page


#1

hi
i am stuck .whether i can add side menu on pages other than root page …
plz suggest


#2

You can add it on the app.html file, and control if the user is logged, show the <ion-menu>.


#3

i have already added in app .hml

<–!<ion-menu [content]=“content” >


Menu

{{p.title}}

!–>


#4

You added like this? Here is the docs of Menu.

<ion-menu [content]="mycontent">
  <ion-content>
    <ion-list>
      <p>some menu content, could be list items</p>
    </ion-list>
  </ion-content>
</ion-menu>

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

#5

my app.html

<ion-menu [content]="content" >
  <ion-header>
    <ion-toolbar>
      <ion-title>Menu</ion-title>
    </ion-toolbar>
  </ion-header>

  <ion-content>
    <ion-list>
      <button menuClose ion-item *ngFor="let p of pages" (click)="openPage(p)">
        {{p.title}}
      </button>
    </ion-list>
  </ion-content>

</ion-menu>


<ion-nav [root]="rootPage" #content swipeBackEnabled="false"></ion-nav>


seconpage.html

<ion-header>
  <ion-navbar hideBackButton >
   <ion-title >One Share</ion-title>
     
    <ion-buttons end>
      
      <label> {{ firstParams }}
      <button ion-button full (click)="logout()">
        <ion-icon name="log-out"></ion-icon>
      </button></label>
      <button ion-button  full (click)="crateVm()"><ion-icon name="cloud"></ion-icon>
      </button>
      <button ion-button  full (click)="doAlert()"><ion-icon name="notifications-outline"></ion-icon>
        <!--<ion-icon name="cloud" full (click)="crateVm()"></ion-icon>-->
      </button>  
       <button menuToggle>
    <ion-icon name="menu"></ion-icon>
  </button>
    </ion-buttons>
  

  </ion-navbar>  
</ion-header>
<ion-content padding>
<h1>welcome</h1>

  </ion-content>


i did like this but menu is not appearing on second page


#6

On secondpage, put this button after ion-navbar: <button ion-button menuToggle icon-only item-left><ion-icon name="menu"></ion-icon></button>


#7

Do you have the variable pages on app.component.ts? And what about the function openPage(p), is there too?


#8

thanks a lot its working


#9

it only works when url changes according to you component and page if url is changing then and only then side menu works fine please add segment in your import ionicPage then it works fine .

don’t know internal interration but this is the solution i found if you done the component of side menu still works if url changing or do setRoot as well .