Два основных роутера с разной раскладкой

Question

Макет для всех пользователей

Макет для персонала (например, панель управления администратора)

у меня есть такой router-outlet который имеет первый макет. В /personnel Я хотел бы использовать второй. Как это сделать? Я не хочу скрывать элементы, потому что personnel также имеет такие компоненты, как personnel/users и т.п.

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

Давайте сделаем это немного более понятным.

const appRoutes: Routes = [
  { // first layout (here is the first and for now the only one router-outlet
    path: '',
    children: [
      { path: '', component: SiteComponent, pathMatch: 'full' },
      { path: 'install', component: InstallationComponent, canActivate: [ InstallationAuth ] },
      { path: 'login', component: LoginComponent, canActivate: [ LoginAuth ] },
      { path: 'register', component: RegisterComponent },
      { path: 'reset', component: ResetComponent, canActivate: [ LoginAuth ] }
    ]
  },
  { //second layout (personnel should have it's own router-outlet
    path: 'personnel',
    children: [
      { path: '', component: PersonnelComponent, canActivate: [ PersonnelAuth ]},
      { path: 'users', component: UsersComponent, outlet: 'personnel' }
    ]
  }
];

Answer 1

Вы можете переместить иерархию маршрутов на один шаг вниз, поэтому в своем корневом компоненте приложения определите <router-outlet></router-outlet> без какого-либо макета, за один шаг вниз определите ваш пустой компонент маршрута по умолчанию с вашим основным макетом

<...LayoutMain>
 <router-outlet></router-outlet>
<...LayoutMain>`

во втором компоненте определите ваш персонал.

  <...Layoutpersonnel >
     <router-outlet></router-outlet>
    <...Layoutpersonnel >`