Add sidemenu with ionic 2

Question

Add sidemenu with ionic 2

Navigation

#1 by (1 votes)

1

Hello, I have a project in development with ionic. And I need to show a sidemenu, but the examples I have obtained are using the sidemenu template of ionic which works very differently. If you could explain me or put a link to see how I could do it

ionic

asked by Wuilmer Medrano 23.11.2016 в 00:42

source

1 answer

Update Entity Framework 6 Objects disconnected Entities 1: N (One to many) Document ready angular

score 1 · Accepted Answer

It's simple, create a new component in the view ( HTML ) and add the following:

 <ion-menu [content]="content">
  <ion-header>
    <ion-toolbar>
      <ion-title>Pages</ion-title>
    </ion-toolbar>
  </ion-header>
  <ion-content>
    <ion-list>
      <button menuClose ion-item>
        Opcion 1
      </button>
      <button menuClose ion-item>
        Opcion 2
      </button>
    </ion-list>
  </ion-content>
</ion-menu>

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

And this in the file ". ts" :

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { HomePage } from '../home/home';

@Component({
  templateUrl: 'menu.html',
})
export class MenuPage {

  public rootPage: any;

  constructor(private navCtrl: NavController) {
        this.rootPage = HomePage;
  }

}

To use it in another component you will only have to add a button with the property menuToggle like this:

<button ion-button icon-only menuToggle>  <ion-icon name="menu"></ion-icon </button>