Geek Answers Handbook

The menu component is not displayed.

I am trying to add a ' hamburger menu to an empty ionic2 template. Not sure what I'm doing wrong here, but all I did was create an empty ionic template, change the template line in templateUrl in app.ts and paste the code in app.html. I am not getting any console errors.

app.ts:

import {Component} from '@angular/core'; import {Platform, ionicBootstrap} from 'ionic-angular'; import {StatusBar} from 'ionic-native'; import {HomePage} from './pages/home/home'; @Component({ templateUrl: 'build/app.html' }) export class MyApp { rootPage: any = HomePage; constructor(platform: Platform) { platform.ready().then(() => { // Okay, so the platform is ready and our plugins are available. // Here you can do any higher level native things you might need. StatusBar.styleDefault(); }); } } ionicBootstrap(MyApp);

app.html:

 <ion-menu [content]="content"> <ion-toolbar> <ion-title>Pages</ion-title> </ion-toolbar> <ion-content> <ion-list> <button ion-item (click)="openPage(loginPage)"> Login </button> <button ion-item (click)="openPage(signupPage)"> Signup </button> </ion-list> </ion-content> </ion-menu> <ion-nav [root]="rootPage"></ion-nav>
+5
source share
1 answer

I missed the button

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

From home.html

 <ion-navbar *navbar> <ion-title> Blank Starter </ion-title> <button right menuToggle> <ion-icon name="menu"></ion-icon> </button> </ion-navbar> <ion-content class="home"> <h1 text-center>Content goes here!</h1> </ion-content>
+3
source

More articles:


All Articles