Question

我最难过。我已经设置了我认为合适的结构，但该应用程序不允许我导航，更糟糕的是，它向我显示了相同的页面。我正在尝试导航到/ login，但没有任何作用。

应用程序路由


const routes: Routes = [
  ///// OPEN ROUTES /////
  { path: "login", component: LoginComponent },
  ///// AUTHENTICATED ROUTES /////
  { path: "home", component: HomeComponent },
  ///// FEATURE MODULES (LAZY LOADED) /////
  {
    path: "clients",
    loadChildren: () =>
      import("./clients/clients.module").then((m) => m.ClientsModule),
  },

  ///// CATCH ALL ROUTES /////
  { path: "not-authorized", component: NotAuthorizedComponent },
  { path: "", redirectTo: "home", pathMatch: "full" },
  { path: "**", component: PageNotFoundComponent },
];

客户路由模块

const routes: Routes = [
  {
    path: "",
    component: ClientsComponent,
    children: [
      {
        path: ":id",
        component: ClientDetailsComponent,
      },
      {
        path: ":id/edit",
        component: ClientEditComponent,
      },
      {
        path: "add",
        component: ClientAddComponent,
      },
      {
        path: "**",
        redirectTo: "",
      },
    ],
  },
];

导航页面在A链接上仅具有routerLink =“ / login”

＃

编辑

忘记从主应用程序模块中卸载ClientsModule，因此它已加载了两次。

Answer 1

要检查的事情：

app.component.html中是否有路由器出口
客户端路由模块不正确。更具体的路线转到顶部，而不太具体的路线转到底部：

children: [ { path: "add", ... }, { path: ":id", ... }, { path: ":id/edit", ... } ]

Angular 8延迟加载模块-无法导航

1 个答案: