How should I sperate Menu from app.component.ts

Ionic Framework ionic-v3
1

Hi

When I create a ionic2 project with side menu template, menu will be generated in app.component.ts, as much as menu become more complex then app.component.ts will become more complex, I was wondering how can I separate menu and move it to it’s stand alone template and ts file?

2

What I’ve been experimenting with doing is bringing the menu stuff into a service, except for openPage, which stays in app.component.ts. This allows me to inject the menu into other components or services which can add and remove items, enable and disable items, or change item context (such as things that should be passed via NavParams in openPage). This allows a great deal of flexibility in the menu without necessitating inter-component communication.

3

then where did you add htmls for menu, for example showing user profile picture and edit profile?
is there any way to have menu.ts, menu.html and injecting them as menu in the app.component.ts?

4

My menu items have icons, titles, target pages, whether or not to push or change root, and context parameters. Not that much different from those in the conference app, I suppose, so maybe my strategy won’t work for you. Sorry.

5

Thanks for help, let see what others suggest.