SideMenu with User Information in Ionic - ionic-framework

Question

I trying add side menu in my Ionic Project. I could do add this code, but i need which have information of my users.
This is complicated beceause the side menu initialize in app.component.html, that it to say, in the start of app, and the information get after of login.
App.component.html
<ion-menu id='menu' [content]="content">
<ion-header>
<ion-toolbar>
<ion-title>Menu</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-list>
<button ion-item>
Preparaciones
</button>
<button ion-item>
Revisiones
</button>
<button ion-item (click)='openCuenta()'>
Cuenta
</button>
</ion-list>
</ion-content>
</ion-menu>
<ion-nav #content [root]="rootPage"></ion-nav>`
I think if i would create a component with this code. How would add this component in the start of app after the add the information of user?

Answer 1

You can use a Provider to provide your user information. For example, if you have an UserProvider with an "user" attribute, you can do this:
In app.component.ts:
...
export class MyApp {
constructor(public userProvider: UserProvider) {
...
And, in app.html use *ngIf directive:
<ion-menu id='menu' [content]="content">
<ion-header>
<ion-toolbar>
<ion-title>Menu</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-list *ngIf="userProvider.user">
<button ion-item>
Preparaciones
</button>
<button ion-item>
Revisiones
</button>
<button ion-item (click)='openCuenta()'>
Cuenta
</button>
</ion-list>
</ion-content>
</ion-menu>