I have this regular side menu setup in Ionic2 app.
app.ts
import {Component, ViewChild} from '@angular/core';
import {Platform, ionicBootstrap, Nav} from 'ionic-angular';
import {StatusBar} from 'ionic-native';
import {TabsPage} from './pages/tabs/tabs';
import { MapPage } from './pages/map/map';
import { ContactPage } from './pages/contact/contact';
import { AboutPage } from './pages/about/about';
@Component({
templateUrl: 'build/pages/menu/menu.html'
})
export class MyApp {
@ViewChild(Nav) nav: Nav;
private menu: any;
rootPage: any = MapPage;
public pages: Object[];
constructor(private 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();
});
this.pages = [
{ title: 'Map', component: MapPage },
{ title: 'Dick pics', component: ContactPage },
{ title: 'Weird stuff', component: AboutPage }
];
this.rootPage = MapPage;
}
openPage(page) {
debugger
this.nav.setRoot(page.component);
}
}
ionicBootstrap(MyApp);
And heres the template for it, menu.html
<ion-menu side="left" [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-nav id="nav" [root]="rootPage" #content swipe-back-enabled="false"></ion-nav>
I am using google map. Every time I open menu, my view with a map inside it gets reinitialized every time. Since I am using “onPageLoaded” view lifecycle event it also gets fired every time.
How can I initialize and load only single map (or any other) view instance and get back to it while navigating the side menu without a need to reinitialize it?