路由孩子在角度 8 中不起作用答案

【问题标题】：Routing children is not working in angular 8路由孩子在角度 8 中不起作用
【发布时间】：2020-04-10 21:23:15
【问题描述】：

尝试解决路由子问题，但无法解决。如果我单击管理按钮不起作用，则不是管理部分的重定向。如何解决此问题。

演示：https://stackblitz.com/edit/angular-3mngoh?file=src/app/approuting.module.ts

approuting.module.ts：

const routes: Routes = [ 
 {
 path: 'admin',
 component: AdminSectionComponent,
 children: [ 
 { path: '', loadChildren: () => import('./adminsection/layout/layout.module').then(m =>  m.LayoutModule) },
 { path: 'login', loadChildren: () => import('./adminsection/login/login.module').then(m => m.LoginModule) },
 { path: 'signup', loadChildren: () => import('./adminsection/signup/signup.module').then(m => m.SignupModule) },
 { path: 'error', loadChildren: () => import('./adminsection/server-error/server-error.module').then(m => m.ServerErrorModule) },
 { path: 'access-denied', loadChildren: () => import('./adminsection/access-denied/access-denied.module').then(m => m.AccessDeniedModule) },
 { path: 'not-found', loadChildren: () => import('./adminsection/not-found/not-found.module').then(m => m.NotFoundModule) },
 { path: '**', redirectTo: 'not-found' }

 ]
 },....etc

【问题讨论】：

标签： typescript angular6 angular8 angular7-router

【解决方案1】：

路由没有发生，因为从你的 UI 中点击 admin 它寻找 /login 显示未找到并给出错误。所以在分析后我发现在 AdminSection-RoutingModule.ts 中的评论行。这个是您的代码路由数组替换为下面的代码。

您的代码：-----------

  const routes: Routes = [
  {path:'',component:AdminSectionComponent,

  children:[

 { path: '', loadChildren: () => import('./layout/layout.module').then(m => m.LayoutModule), canActivate: [AuthGuard] },
    { path: 'login', loadChildren: () => import('./login/login.module').then(m => m.LoginModule) },
    { path: 'signup', loadChildren: () => import('./signup/signup.module').then(m => m.SignupModule) },
    { path: 'error', loadChildren: () => import('./server-error/server-error.module').then(m => m.ServerErrorModule) },
    { path: 'access-denied', loadChildren: () => import('./access-denied/access-denied.module').then(m => m.AccessDeniedModule) },
    { path: 'not-found', loadChildren: () => import('./not-found/not-found.module').then(m => m.NotFoundModule) },
    { path: '**', redirectTo: 'not-found' }
  ]}

];

替换代码：--------

    const routes: Routes = [
  {path:'',component:AdminSectionComponent,

  children:[
    { path: 'login', loadChildren: () => import('./login/login.module').then(m => m.LoginModule) },
    { path: 'signup', loadChildren: () => import('./signup/signup.module').then(m => m.SignupModule) },
    { path: 'error', loadChildren: () => import('./server-error/server-error.module').then(m => m.ServerErrorModule) },
    { path: 'access-denied', loadChildren: () => import('./access-denied/access-denied.module').then(m => m.AccessDeniedModule) },
    { path: 'not-found', loadChildren: () => import('./not-found/not-found.module').then(m => m.NotFoundModule) },
    { path: '**', redirectTo: 'not-found' }
  ]}

];

替换为 myy 数组后会发生路由，然后你就会知道为什么路由没有发生

【讨论】：