I have a funny problem.
I have made a layout component.
LayoutComponent
<ion-split-pane contentId="main">
<ion-menu side="start" menuId="custom" contentId="main">
<ion-header>
<div id="userBox">
<div id="userImage"><i class="far fa-user-circle"></i></div>
<p>Nicolas Lauinger<br>TGOPOD</p>
<div id="switchTheme">
<div class="onoffswitch">
<input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="myonoffswitch" #theme [(ngModel)]="currentTheme" (change)="changeTheme(theme)">
<label class="onoffswitch-label" for="myonoffswitch">
<span class="onoffswitch-inner"></span>
<span class="onoffswitch-switch"></span>
</label>
</div>
</div>
<p class="logout">
<i class="fas fa-sign-out-alt"></i>
</p>
</div>
</ion-header>
<ion-content>
<ion-list>
<ion-menu-toggle auto-hide="false" *ngFor="let nav of navi">
<ion-item lines="none" [class.active]="isActive('/'+ nav.link)" [routerLink]="'/'+ nav.link">
<i slot="start" class="fas {{nav.icon}}"></i>{{nav.linkName}}
</ion-item>
</ion-menu-toggle>
</ion-list>
</ion-content>
</ion-menu>
<ion-router-outlet animated="false" id="main"></ion-router-outlet>
</ion-split-pane>
In the app-routing.module.ts it is called at every path.
app-routing.module.ts
import {NgModule} from '@angular/core';
import {PreloadAllModules, RouterModule, Routes} from '@angular/router';
import {LayoutWithSideNavComponent} from './layout/layout-with-side-nav/layout-with-side-nav.component';
const routes: Routes = [
{
path: '',
redirectTo: 'home',
pathMatch: 'full'
},
{
path: 'home',
component: LayoutWithSideNavComponent,
loadChildren: () => import('./pages/home/home.module').then(m => m.HomePageModule)
},
{
path: 'info',
component: LayoutWithSideNavComponent,
loadChildren: () => import('./pages/info/info.module').then(m => m.InfoPageModule)
}
];
@NgModule({
imports: [
RouterModule.forRoot(routes, {preloadingStrategy: PreloadAllModules})
],
exports: [RouterModule]
})
export class AppRoutingModule {
}
That’s what it looks like.
Now when I click on contact it looks like this.
So far everything as expected and in order. But when I click on Dashboard again it suddenly looks like this. The navigation bar has disappeared.
What am I doing wrong?