user2085143
user2085143

Reputation: 4232

Ionic 2 - menuClose On Image Click

In Ionic 2 you can add the

menuClose

directive on a button so that the side menu will close upon being clicked.

I would like to close the menu when an image is clicked, rather than a button. The image is located within the ion-menu.

Is there a way I can call the menu close function when the image is clicked?

Here's my HTML

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

  <ion-header>
    <ion-toolbar>
        <img src="myLogo.svg" class='logo' (click)='closeSideMenu()'>
    </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>

Upvotes: 1

Views: 1352

Answers (2)

user1752532
user1752532

Reputation:

You can hook into the MenuController directly in your component

import { MenuController } from 'ionic-angular';

@Component({...})
export class MyPage {
constructor(public menuCtrl: MenuController) {}

  closeSideMenu() {
    this.menuCtrl.close();
  }
}

You can find more information here

Upvotes: 2

Ricardo Cunha
Ricardo Cunha

Reputation: 2075

You can do a workaround, make a button with a background image, without label using css: background: url('background.jpg');

Upvotes: 0

Related Questions