I am struggling to add a 'burger' menu into the blank ionic2 template. Not sure what am doing wrong here but all I have done is generate a blank ionic template, change template string to templateUrl in the app.ts and paste code into app.html. 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>
I was missing 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>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With