路由重定向到 Angular 中的其他 link 问题

Question

好的，我试着让 adviceRouterModule 工作。

当然我尝试了很多。用谷歌搜索。但是我想不通。

所以我有这个 AdviceRoutingModule:

const adviceRouters: Routes = [
  {
    path: '',
    component: AdviceNavigationComponent,
    canActivate: [AuthGuard],
    children: [
      {path: '', redirectTo: 'huidig', pathMatch: 'full', canActivate: [AuthGuard] },
      {path: 'huidig', component: AdviceComponent, canActivate: [AuthGuard] },
      {path: 'archief', component: AdviceArchiveComponent, canActivate: [AuthGuard] },
    ]
  }
];


@NgModule({
  imports: [RouterModule.forChild(adviceRouters)],
  exports: [RouterModule]
})



export class AdviceRoutingModule {}

advicenavigation 模板如下所示：

<nav class="nav-tab-bar">
  <a routerLink="/advies/huidig" routerLinkActive="active" class="nav-tab-bar-tab">Adviezen</a>
  <a routerLink="/advies/archief" routerLinkActive="active" class="nav-tab-bar-tab">Eerdere Adviezen</a>
</nav>
<router-outlet></router-outlet>

因此，如果用户点击 Adviezen，则工作示例必须被引导至：

http://localhost:4200/advies/huidig

但现在什么也没有发生

url 工作正常。

我现在是这样的:

const adviceRouters: Routes = [
  {
    path: 'advies',
    component: AdviceNavigationComponent,
    canActivate: [AuthGuard],
    children: [
      {path: '', redirectTo: 'huidig', pathMatch: 'full', canActivate: [AuthGuard] },
      {path: 'huidig', component: AdviceComponent, canActivate: [AuthGuard] },
      {path: 'archief', component: AdviceArchiveComponent, canActivate: [AuthGuard] },
    ]
  }
];

当然还有 advice.moduel:

@NgModule({
    imports: [

       AdviceRoutingModule,
        CommonModule,
        ReactiveFormsModule,
        SharedModule
       ],

啊哈，这就是诀窍：

const adviceRouters: Routes = [
  {
    path: 'advies',
    canActivate: [AuthGuard],
    children: [
      {path: '', redirectTo: 'huidig', pathMatch: 'full', canActivate: [AuthGuard] },
      {path: 'huidig', component: AdviceComponent, canActivate: [AuthGuard] },
      {path: 'archief', component: AdviceArchiveComponent, canActivate: [AuthGuard] },
    ]
  }
];

Answer 1

您应该将 'advies' 添加到我认为的 "main" 路径，如下所示：

const adviceRouters: 路线 = [ { 路径：'advies' ...

路由重定向到 Angular 中的其他 link 问题

Routing redirect To other link in Angular problem

javascript

angular

typescript

angular-ui-router