Angular路由问题：父组件添加routerLink后页面未更新

问题根源 #

你当前的父组件（DashboardComponent）模板中未添加<router-outlet>标签——子路由组件需要这个出口才能被渲染到页面上，这是导致点击routerLink后页面没变化的核心原因。

解决步骤 #

1. 打开DashboardComponent的模板文件（比如dashboard.component.html）
2. 在需要展示子组件的位置插入<router-outlet></router-outlet>，比如放在你截图里两个导航链接的下方区域

额外检查点 #

确认父组件里的routerLink路径是否正确：

• 相对路径写法：routerLink="overview" 或 routerLink="./overview"
• 绝对路径写法：routerLink="/autocomplete/overview"
  两种写法都能匹配你配置的子路由，确保路径没有拼写错误。

你的路由配置（已格式化） #

const childrenRoutes: Routes =[
  {path: 'overview', component: AutocompleteOverviewComponent},
  {path: 'api', component: AutocompleteApiComponent}
]

const routes: Routes = [
  {path: '', redirectTo: 'autocomplete', pathMatch: 'full'},
  {path: 'autocomplete', component: DashboardComponent, children: childrenRoutes},
];

内容的提问来源于stack exchange，提问作者jade1411