Angular嵌套路由

嵌套路由

1.在app-routing.module.ts檔案中配置路由

const routes: Routes = [
  	{path:"home",component:HomeComponent,
  	children:[
  		  {path:'tabbar',component:TabbarComponent},
   	 	  {path:'footer',component:FooterComponent},
	  ]
	  },
  	{path:"profile",component:ProfileComponent},
	];
           

2.在home元件的html中

這裡的url需要包含父路由，也就是home

<a [routerLink]="[ '/home/tabbar' ]">tabbar</a>
	<a [routerLink]="[ '/home/footer' ]">footer</a>
	<router-outlet></router-outlet>