Parsaria
Parsaria

Reputation: 1089

How can I add a button on Ionic toolbar for all pages?

In fallowing code I want to add a search Icon at the navbar in front of menu item:

<ion-menu [content]="content">
    <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-buttons end>
  <button ion-button icon-only>
    <ion-icon name="search"></ion-icon>
  </button>
</ion-buttons>
<ion-nav [root]="rootPage" #content swipeBackEnabled="false"></ion-nav>

But this code is not working.

Upvotes: 1

Views: 1703

Answers (1)

Vega
Vega

Reputation: 28708

Put <ion-nav> first then <ion-menu> so it's not covered. And put everything in app.html:

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

<ion-menu [content]="content">
    <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-buttons end>
  <button ion-button icon-only>
    <ion-icon name="search"></ion-icon>
  </button>
</ion-buttons>

Upvotes: 2

Related Questions