1. 在app-routing.module.ts文件中，为子菜单设置相对于主页的路径，例如：

const routes: Routes = [ { path: '', component: HomePageComponent }, { path: 'submenu1', component: Submenu1Component }, { path: 'submenu2', component: Submenu2Component }, { path: 'submenu3', component: Submenu3Component }, ];

2. 在子菜单组件中，使用routerLink指令来设置子菜单链接。例如：

• Submenu 1
• Submenu 2
• Submenu 3

3. 在每个子菜单组件中，使用router.navigate()方法来将路由导航到主页。例如：

import { Router } from '@angular/router';

@Component({ selector: 'app-submenu1', templateUrl: './submenu1.component.html', styleUrls: ['./submenu1.component.css'] }) export class Submenu1Component implements OnInit {

constructor(private router: Router) { }

ngOnInit() { }

gotoHomePage() { this.router.navigate(['']); }

}

4. 在子菜单组件的模板文件中，使用按钮或链接来调用gotoHomePage()方法。例如：

Go back to home page

这样每当用户点击子菜单页面中的返回主页按钮时，就会自动跳转回到主页，避免了子菜单路由直接返回主页时出现的问题。