Question

我希望在父模块和子模块中具有相同的路由路径，但是它们彼此重叠。

我有两个模块：

AppModule (sets forRoot routes) -> AppComponent, LayoutComponent
ContentModule (sets forChild routes) -> ContentComponent

AppComponent.html：

<router-outlet></router-outlet>

AppModule的路由：

{path: '', component: LayoutComponent}

LayoutComponent.html：

This is a layout:
<content-component></content-component>

ContentModule的路由：

{path: '', component: ContentComponent}

ContentComponent.html：

<router-outlet></router-outlet>

因此，基本上，我希望LayoutComponent的布局始终存在，如果路径以/开头，然后加载ContentComponent（如果它仍为/）。当我在ContentModule中添加新组件并设置新路线时，例如在/childcomponent上，我想向ChildComponent加载新的router-outlet。

我想念什么吗？怎么了？

Answer 1

您需要在ContentModule中设置forChild的路由，并在其中传递带有router-outlet的组件。在那个地方之后，有一系列路线的孩子们。

@NgModule({
...
  imports: [....,
    RouterModule.forChild(ContentRoutes)
....]...

路由文件：

 export const ContentRoutes: Routes = [
      { path: '', component: MainComponent, children:
        [
          { path: '', component: ContentComponent },
          { path: 'another', component: AnotherComponent },
          { path: 'another2', component: Another2Component },
        ]
      }
    ];

子路径具有相同的路径

1 个答案: