У меня есть основной модуль приложения и несколько лениво загруженных модулей. Есть одно боковое меню, с помощью которого контролируется вся навигация приложения, все работает нормально, но каждый раз, когда я переключаюсь с одного модуля на следующий загруженный ленивый модуль, все меню перезагружается и состояние активного элемента меню сбрасывается, пользователь должен нажать на кнопку. боковое меню во второй раз для переключения между ссылками. Когда модуль загружен, после второго щелчка по боковому меню он работает (боковое меню остается открытым, показывает, где пользователь нажал-> состояние сохраняется), но как только он нажимает на ссылку, перенаправляющую в другой модуль, боковое меню закрывается.
любая помощь очень ценится, спасибо.
это при маршрутизации на другую страницу того же модуля, состояние остается
*, как только мы нажимаем на маршрут к компоненту другого модуля, меню сбрасывается, и пользователь не может знать, какой модуль он cli c * 
ОСНОВНОЙ ФАЙЛ МАРШРУТНОГО ПРИЛОЖЕНИЯ
export const routes: Routes = [
{
path: '', component: AppMainComponent,
canActivate: [AuthGuard],
children: [
{ path: '', redirectTo: '/dashboard', pathMatch: 'full' },
{ path: 'dashboard', component: DashboardComponent },
]
},
{ path: 'regional-hierarchy', loadChildren: './regionalhierarchy/regionalhierarchy.module#RegionalhierarchyModule' },
{ path: 'product', loadChildren: './product/product.module#ProductModule' },
{ path: 'pricing', loadChildren: './pricing/pricing.module#PricingModule' },
{ path: 'distributory', loadChildren: './distribution/distribution.module#DistributionModule' },
{ path: 'stock', loadChildren: './stock/stock.module#StockModule' },
{ path: 'factory', loadChildren: './factory/factory.module#FactoryModule' },
{ path: 'sole', loadChildren: './sole/sole.module#SoleModule' },
{ path: 'shopcredit', loadChildren: './shopcredit/shopcredit.module#ShopcreditModule' },
// { path: 'shop', loadChildren: './shops/shops.module#ShopsModule' },
{ path: 'stock', loadChildren: './stock/stock.module#StockModule' },
{ path: 'error', component: AppErrorComponent },
{ path: 'accessdenied', component: AppAccessdeniedComponent },
{ path: '404', component: AppNotfoundComponent },
{ path: '**', redirectTo: '/404' },
];
export const AppRoutes: ModuleWithProviders =
RouterModule.forRoot(routes, { scrollPositionRestoration: 'enabled' });
ФАЙЛ МАРШРУТА С ПОЛОЖЕННЫМ МОДУЛЕМ
const routes = [
{
path: '',
component: RegionalhomeComponent,
canActivate: [AdminGuard],
children: [
{ path: 'createRegion', component: CreateRegionComponent },
{ path: 'viewRegions', component: ViewRegionsComponent },
{ path: 'createZone', component: CreateZoneComponent },
{ path: 'viewZones', component: ViewZonesComponent },
{ path: 'createArea', component: CreateAreaComponent },
{ path: 'viewAreas', component: ViewAreasComponent },
{ path: 'createTerritory', component: CreateTerritoryComponent },
{ path: 'viewTerritories', component: ViewTerritoriesComponent },
{ path: 'createCity', component: CreateCityComponent },
{ path: 'viewCities', component: ViewCitiesComponent },
{ path: 'createTown', component: CreateTownComponent },
{ path: 'viewTowns', component: ViewTownsComponent },
{ path: 'createRoute', component: CreateRouteComponent },
{ path: 'viewRoutes', component: ViewRoutesComponent },
{ path: '', component: RegionalhomeComponent }
]
}
]
@NgModule({
declarations: [],
imports: [
CommonModule,
RouterModule.forChild(routes)
]
})
export class RegionalhierarchyRoutingModule { }
** ГЛАВНЫЙ КОМПОНЕНТ APP HTML **
<div class="layout-wrapper" [ngClass]="{'layout-horizontal': menuMode === 'horizontal',
'layout-overlay': menuMode === 'overlay',
'layout-static': menuMode === 'static',
'layout-slim': menuMode === 'slim',
'layout-menu-light': lightMenu === true,
'layout-menu-dark': lightMenu === false,
'layout-overlay-active': overlayMenuActive,
'layout-mobile-active': staticMenuMobileActive,
'layout-static-inactive': staticMenuDesktopInactive,
'layout-rtl': isRTL}" [class]="topbarColor" (click)="onLayoutClick()">
<app-topbar></app-topbar>
<app-menu [reset]="resetMenu"></app-menu>
<app-right-menu></app-right-menu>
<div class="layout-main">
<div class="layout-content">
<router-outlet></router-outlet>
</div>
</div>
<div class="layout-content-mask"></div>
- это компонент, состояние которого мне нужно сохранить при переключении на лениво загруженный модуль сам файл очень большой, поэтому я вставляю сюда только его часть ..
компонент app-menu
{ label: 'Home', icon: 'pi pi-fw pi-home', routerLink: ['/'] },
{
label: 'Sale', icon: 'pi pi-fw pi-copy',
items: [
{
label: 'Territorial Structure', icon: 'pi pi-fw pi-clone',
skipLocationChange: true,
items: [
{
label: 'Region', icon: 'pi pi-fw pi-sign-in',
items: [
{
label: 'Add Region', icon: 'pi pi-fw pi-plus', routerLink: ['/regional-hierarchy/createRegion'],
},
{
label: 'View Regions', icon: 'pi pi-fw pi-window-maximize', routerLink: ['/regional-hierarchy/viewRegions'],
queryParams: { 'recent': 'true' },
routerLinkActiveOptions: "{exact: true}",
command: (event) => {
//event.originalEvent: Browser event
//event.item: menuitem metadata
},
target: '_blank'
}
]
},
{
label: 'Zone', icon: 'pi pi-fw pi-sign-in',
items: [
{ label: 'Add Zone', icon: 'pi pi-fw pi-plus', routerLink: ['/regional-hierarchy/createZone'], target: '_blank' },
{ label: 'View Zones', icon: 'pi pi-fw pi-window-maximize', routerLink: ['/regional-hierarchy/viewZones'], target: '_blank' }
]
},
{
label: 'Area', icon: 'pi pi-fw pi-sign-in',
items: [
{ label: 'Add Area', icon: 'pi pi-fw pi-plus', routerLink: ['/regional-hierarchy/createArea'], target: '_blank' },
{ label: 'View Areas', icon: 'pi pi-fw pi-window-maximize', routerLink: ['/regional-hierarchy/viewAreas'], target: '_blank' }
]
},
{
label: 'Territory', icon: 'pi pi-fw pi-sign-in',
items: [
{ label: 'Add Territory', icon: 'pi pi-fw pi-plus', routerLink: ['/regional-hierarchy/createTerritory'], target: '_blank' },
{ label: 'View Territories', icon: 'pi pi-fw pi-window-maximize', routerLink: ['/regional-hierarchy/viewTerritories'], target: '_blank' }
]
},
и выше это app.main.component
<router-outlet></router-outlet>