# Side menu!

**URL:** <https://forum.ionicframework.com/t/side-menu/121240>\
**Category:** ionic-v3\
**Created:** [February 12, 2018, 11:01am UTC](https://forum.ionicframework.com/t/side-menu/121240 "2018-02-12T11:01:37Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![uddyvky](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/uddyvky/32/121897_2.png) [@uddyvky](https://forum.ionicframework.com/u/uddyvky)\
**Post date:** [February 12, 2018, 11:01am UTC](https://forum.ionicframework.com/t/side-menu/121240/1 "2018-02-12T11:01:37Z")

</div>

I’m new to Ionic and building a app using side menu template, and I already built a side-menu for admin. And I’m stuck at a problem.  
How can I have two different menus one for user and another for admin in the same app? Please Help!!

---

<div class="post-metadata">

**Author:** ![FnnHuman](https://avatars.discourse-cdn.com/v4/letter/f/5f8ce5/32.png) [@FnnHuman](https://forum.ionicframework.com/u/FnnHuman)\
**Post date:** [February 12, 2018, 12:08pm UTC](https://forum.ionicframework.com/t/side-menu/121240/2 "2018-02-12T12:08:00Z")

</div>

hello, show me your side menu code, because answer of your question depends on how it looks like

---

<div class="post-metadata">

**Author:** ![uddyvky](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/uddyvky/32/121897_2.png) [@uddyvky](https://forum.ionicframework.com/u/uddyvky)\
**Post date:** [February 12, 2018, 1:17pm UTC](https://forum.ionicframework.com/t/side-menu/121240/3 "2018-02-12T13:17:42Z")

</div>

this is my code:

import { Component, ViewChild } from ‘@angular/core’;  
import { Nav, Platform } from ‘ionic-angular’;  
import { StatusBar } from ‘@ionic-native/status-bar’;  
import { SplashScreen } from ‘@ionic-native/splash-screen’;  
import { Storage } from ‘@ionic/storage’;

import { HomePage } from ‘…/pages/home/home’;  
import { ListPage } from ‘…/pages/list/list’;  
import { CreateuserPage } from ‘…/pages/createuser/createuser’;  
import { AddProjectPage } from ‘…/pages/add-project/add-project’;  
import { AssignProjectPage} from ‘…/pages/assign-project/assign-project’;  
import { AdminPage } from ‘…/pages/admin/admin’;  
import { UsrprojPage } from ‘…/pages/usrproj/usrproj’;  
import { UsrProfilePage } from ‘…/pages/usr-profile/usr-profile’;  
import { UserhomePage } from ‘…/pages/userhome/userhome’;

@Component({  
templateUrl: ‘app.html’  
})  
export class MyApp {  
pagess: Array \<{ title: string; component: any }\>;  
@ViewChild(Nav) nav: Nav;

rootPage: any = HomePage;

pages: Array\<{title: string, component: any}\>;

constructor(public platform: Platform, public statusBar: StatusBar, public splashScreen: SplashScreen) {  
this.initializeApp();

```
// used for an example of ngFor and navigation
this.pages = [// admin menu starts-------------------------------
  { title: 'Home', component: AdminPage },

 // { title: 'List', component: ListPage },
 
  { title: 'Add User', component: CreateuserPage},
  { title: 'Add Project', component: AddProjectPage},
  { title: 'Assign Project', component: AssignProjectPage},
  { title: 'Logout', component: null},//admin menu ends-------------
 
];

```

}

initializeApp() {  
this.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.  
this.statusBar.styleDefault();  
this.splashScreen.hide();  
});  
}

openPage(page) {  
if(page.component) {  
this.nav.setRoot(page.component);  
} else {  
// Since the component is null, this is the logout option  
// …

```
    // logout logic
    // ...

    // redirect to home
    this.nav.setRoot(HomePage);
}

```

}  
}

---

<div class="post-metadata">

**Author:** ![FnnHuman](https://avatars.discourse-cdn.com/v4/letter/f/5f8ce5/32.png) [@FnnHuman](https://forum.ionicframework.com/u/FnnHuman)\
**Post date:** [February 12, 2018, 1:38pm UTC](https://forum.ionicframework.com/t/side-menu/121240/4 "2018-02-12T13:38:29Z")

</div>

you have your sidemenu options stored in array  
just make something like

```auto
if(this.isAdmin == true){
   this.sideMenuArray = this.adminArray;
} else {
   this.sideMenuArray = this.normalArray;
}

```

---

<div class="post-metadata">

**Author:** ![uddyvky](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/uddyvky/32/121897_2.png) [@uddyvky](https://forum.ionicframework.com/u/uddyvky)\
**Post date:** [February 12, 2018, 5:47pm UTC](https://forum.ionicframework.com/t/side-menu/121240/5 "2018-02-12T17:47:03Z")

</div>

thanks I’ll try that! 🙂

---

<div class="post-metadata">

**Author:** ![uddyvky](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/uddyvky/32/121897_2.png) [@uddyvky](https://forum.ionicframework.com/u/uddyvky)\
**Post date:** [February 26, 2018, 6:15am UTC](https://forum.ionicframework.com/t/side-menu/121240/6 "2018-02-26T06:15:02Z")

</div>

Can you please elaborate with an example as I’m stuck again.  
I’m new to ionic and it’s important for me to learn.  
thanks.

---

<div class="post-metadata">

**Author:** ![mhartington](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/mhartington/32/137757_2.png) [@mhartington](https://forum.ionicframework.com/u/mhartington)\
**Post date:** [July 19, 2021, 9:51pm UTC](https://forum.ionicframework.com/t/side-menu/121240/7 "2021-07-19T21:51:07Z")

</div>


