Angular 7 нескольких маршрутизаторов-розеток и отложенной загрузки - PullRequest
0 голосов
/ 14 ноября 2018

У меня есть приложение со следующей структурой

app/
├── app.component.html
├── app.component.scss
├── app.component.ts
├── app.module.ts
├── core/
│   ├── core-routing.module.ts
│   ├── core.module.spec.ts
│   ├── core.module.ts
│   ├── header/
│   ├── layout/
│   ├── services/
│   └── header/
├── someModule1/
├── someModule2/

AppModule, который занимает корень папки, остается максимально пустым.Его роль заключается в том, чтобы просто загрузить приложение Angular и предоставить корневой уровень router-outlet.

Все проходит через CoreModule.Маршруты CoreModule следующие (forRoot ()):

const routes: Routes = [
  {
    path: 'app',
    component: LayoutComponent,
  },
  {
    path: 'somePath',
    loadChildren: '../someModule1/someModule1.module#SomeModule1'
  },
  {
    path: '**', component: NotFoundComponent
  }
];

Это позволяет мне создать экземпляр моего LayoutComponent, в котором содержимое отображается через основной router-outlet и вторичное имя выхода для другихкомпоненты для отображения.

<header-component></header-component>
<mat-drawer-container>
  <mat-drawer #drawer>
    <router-outlet name="sidenav"></router-outlet>
  </mat-drawer>

  <div class="sidenav-content">
    <router-outlet></router-outlet>
  </div>
</mat-drawer-container>

Я сделал все возможное, чтобы отобразить отдельный контент в области sidenav и main-content безуспешно.

Я ожидаю, что <a [routerLink]="['somepath', { outlets: { sidenav: ['foo'] } }]">Outlet Nav</a> отобразит somepathв <router-outlet></router-outlet> и foo в <router-outlet name="foo"></router-outlet>

Что я делаю не так?Я читал, что это может быть связано с отложенными модулями

...