Вложенные маршрутизаторы: родительская маршрутизация работает, дочерний маршрутизатор нет - PullRequest
0 голосов
/ 26 сентября 2019

в Angular 8 Я создал приложение с основной маршрутизацией, а внутри основной маршрутизации есть компонент с другой дочерней маршрутизацией.

У меня есть несколько проблем: когда я вставляю существующий путь, URL-адрес выглядит так:быть правильным, но компонент не отображается, тогда как, если я вставлю неправильный URL-адрес, редирект 404 вступит в силу.

Родительская маршрутизация работает, а дочерняя маршрутизация - нет.

Другая проблема, которую я нахожу, связана с ссылками, я не могу вставить в ссылку "папа / сын", появляется только имя сына.Мне вручную вводится имя отца: «папа / папа / сын».

Я прилагаю код ниже

App.Routing.Module.ts

    const routes: Routes = [
  {path: 'main', component: MainComponent, loadChildren: () => import('./main/main.module').then(m=>m.MainModule), canActivate: [AuthGuard]},

  {path: '', component: MainComponent, canActivate: [AuthGuard]},
  {path: 'login', component: LoginComponent},
  {path: 'register', component: RegisterComponent},

  //THIS REDIRECT TO HOME
  {path: '**', redirectTo: '/login'}
];

@NgModule({
  imports: [RouterModule.forRoot(routes,{enableTracing: true})],
  exports: [RouterModule]
})
export class AppRoutingModule { }

Main.Routing.Module.TS

const routes: Routes = [{
  path: '', component: ColumnChartComponent,  children:[
    {path: 'pie', component: PieChartComponent},
    {path: 'dashboard', component: LayoutDashboardComponent},
    {path: '**', redirectTo: '', pathMatch: 'full'}
  ]
}];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class MainRoutingModule { }

Заранее благодарю за помощь

1 Ответ

0 голосов
/ 26 сентября 2019

Я почти уверен, что у вас не может быть лениво загруженного маршрута (ваш loadChildren ()) и, кроме того, компонента в этой строке маршрута.Поэтому, пожалуйста, измените

{path: 'main', component: MainComponent, loadChildren: () => import('./main/main.module').then(m=>m.MainModule), canActivate: [AuthGuard]}

на:

{path: 'main', loadChildren: () => import('./main/main.module').then(m=>m.MainModule), canActivate: [AuthGuard]}
...