Usr
Usr

Reputation: 2838

ionic 2 header doesn't show side menu "bars"

I've added a side menu in my ionic 2 application that I'm developing, modifying the "super" template given by ionic. I've added the following code in app.html:

<ion-menu [content]="content">

  <ion-header>      
    <ion-toolbar>
      <ion-title>Menu</ion-title>
    </ion-toolbar>
  </ion-header>

  <ion-content>
    <ion-list>
      <button 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>

If I swipe on the left the menu appears correctly, but the problem is that, in the header of pages, I can't see the three bars to open the menu:

enter image description here

From the documentation, it seems that simply adding this code to the html makes the three bars appear, but it isn't working for me. Do I have to change something in the header of all the pages? I don't know, maybe the super template itself overrides something in the header of pages, so that the bars are not showed?

Upvotes: 0

Views: 414

Answers (1)

fer.reyes4
fer.reyes4

Reputation: 129

You could try adding button and icon. Like this:

<ion-header>
    <ion-navbar>
        <button ion-button menuToggle>
            <ion-icon name="menu"></ion-icon>
        </button>
        <ion-title>Menu</ion-title>
    </ion-navbar>
</ion-header>

Upvotes: 3

Related Questions