Angular 8 路由子模块中的子路由

Question

在我的应用程序中，我有一个“父”组件（WorkspaceComponent），它定义了整体布局并为应用程序执行了一些脚手架（实际上它是大部分内容的包装器）。 理想情况下，我希望这个组件不占用任何 URL。

每个“子”路由都在它们自己的路由模块中定义。

父路由配置：（app-routing）

const routes: Routes = [
  {path: 'denied', component: DenialComponent},
  {path: 'workspace', component: WorkspaceComponent, children: [
      {path: 'search', loadChildren: () => import('./search/search.module').then(m => m.SearchModule)},
      {path: 'files', loadChildren: () => import('./files/files.module').then(m => m.FilesModule)},
      {path: 'folders', loadChildren: () => import('./folders/folders.module').then(m => m.FoldersModule)},
      {path: '', redirectTo:'search', pathMatch:'full'}
    ]},
  {path: '', redirectTo:'workspace', pathMatch:'full'}
];

子路由配置 - （搜索）

const searchRoutes: Routes = [{
  path: '', component: SearchComponent, children: [
    {path: 'new', component: SearchEditComponent, pathMatch:'prefix'},
    {path: 'edit/:queryId', component: SearchEditComponent, pathMatch:'prefix'},
    {path: 'convert/:queryId', component: SearchConvertComponent, pathMatch:'prefix'},
    {path: 'details/:queryId', component: SearchDetailsComponent, pathMatch:'prefix'},
    {path: '', redirectTo: 'new', pathMatch: 'full'}
  ],
  runGuardsAndResolvers: 'always'
}];

其他“子”路由（文件和文件夹）几乎模仿了searchRoutes配置。

我面临并需要一些帮助的主要问题是：

• 对于父组件路径（'workspace'），如果我使用''作为路径而不是'workspace'，我希望加载实际的工作空间，但加载的是子路由之一

如何设置我的路由，以便：

• 我可以导航到http://localhost:8080/search并让父组件（WorkspaceComponent）也被加载，而不必在 URL 中有“工作区”？
• 用户可以导航到应用程序的根 URL（即http://localhost:8080 ），它会自动路由到http://localhost:8080路径）

Answer 1

因此，app.module.ts 文件中的导入顺序似乎影响了我的应用程序的加载方式。 我的其他组件路由模块下方列出了 AppRoutingModule。 啊!