如何正确使用路由器插座

Question

嗨，我有以下代码： app.routing.module

 const routes: Routes = [   
 {path: '', redirectTo:'/head', pathMatch:'full'},
 {path:'head',component: HeadComponent},
 {path:'main',component: MainComponent},
 ];

我的头上有

<router-outlet></router-outlet>

应该自动导航到main，但不是。我需要做一个空头，这是所有组件的根。

Answer 1

头上的路由器出口只会渲染头上的孩子，而你根本没有。

您的路线已设置为自动在app组件的路由器出口中渲染头像。 Head没有孩子，因此不会渲染main。您需要在main的子级中添加main。

const routes: Routes = [   
  {path: '', redirectTo:'/head', pathMatch:'full'},
  {
    path:'head',
    component: HeadComponent,
    children: [
      {path:'',component: MainComponent}
    ]
  }
];