Angular 2路由器：未显示子项

Posted 2023-02-23

【中文标题】Angular 2路由器：未显示子项

【英文标题】：Angular 2 router : children not siplayed

【发布时间】：2017-06-28 21:35:58

【问题描述】：

我正在尝试在我的项目中实现 Angular 2 中的用户身份验证包：http://jasonwatmore.com/post/2016/09/29/angular-2-user-registration-and-login-example-tutorial。

我将整个文件夹放入一个名为“loginMGR”的超级文件夹中，在模块、组件和文件名中将“app”重命名为“loginMGR”，并将app-routing.module（现在名为loginMGR.module）更改为：

imports...

const loginRoutes: Routes = [
  
    path: '',
    component: HomeComponent,
    canActivate: [AuthGuard],
    children: [
       path: 'identification', component: LoginComponent ,
       path: 'enregistrement', component: RegisterComponent ,
    ]
  ,

  // otherwise redirect to home
   path: '**', redirectTo: '' 
];

@NgModule(
  imports: [
    RouterModule.forChild(loginRoutes)
  ],
  exports: [
    RouterModule
  ]
)

export class LoginRoutingModule

我的应用路由模块通过以下路由命名链接：

const routes: Routes = [
...
         path: 'authentification', component: LoginMGRComponent ,
... 

感谢这个按钮，我可以访问该捆绑包：

<a [routerLink]="['/authentification']" [routerLinkActive]="['router-link-active']" [routerLinkActiveOptions]="exact:true" class="navbar-link">

但是，我的 loginMGR.component.html 的路由器出口和警报保持为空，并且没有链接到他们应该访问的不同组件（在这种情况下，'' 将是“家”）。

知道我做错了什么吗？

谢谢

【参考方案1】：

由于您在 LoginRoutingModule 中定义了子路由，只需将其导入您的应用模块，然后在应用模块 Routes 中删除该路由。

【讨论】：

就是这样！谢谢你。此外，我没有提到整个文件，我应该这样做。我对 AppRoutingModule 的导入在 LoginRoutingModule 之前，它阻止了声明。