javascript - Angular2 ย่อยควบคุมการกําหนดเส้นทางสําหรับคอมโพเนนต์หลัก

ฉันมีคอมโพเนนต์หลักของพาเรนต์ที่ประกอบด้วยเมนูนำทางด้านบนในตัวเอง คอมโพเนนต์นำทางด้านข้างแยกต่างหาก และ div เนื้อหาหลักที่มี <router-outlet> สำหรับคอมโพเนนต์หลัก ฉันกำลังพยายามทำความเข้าใจว่าควรทำอย่างไรให้ลิงก์ภายในคอมโพเนนต์นำทางย่อยเปลี่ยน router-outlet ในคอมโพเนนต์หลักของพาเรนต์

```

Main Component
@Component({
  selector: 'app',
  templateUrl: 'mainComponent.html',
  encapsulation: ViewEncapsulation.None,
  directives: [ROUTER_DIRECTIVES,ChildSidenav],
})
@RouteConfig([
  { path: '/', component: HomeCmp, as: 'Home' }, //for top nav
  { path: '/about', component: AboutCmp, as: 'About' }, //for top nav
  { path: '/user', component: UserCmp, as: 'User'}, //for top nav
  { path: '/data/...', component: SidenavBasicUsage, as: 'Data'}, //link in child component
  { path: '/dates', component: SelectDatesComponent, as: 'Dates'}, //link in child component
  { path: '/edit/paths', component: EditPathsComponent, as: 'EditPaths'}, //link in child component
  { path: '/edit/filters', component: EditFiltersComponent, as: 'EditFilters'}, //link in child component
])
export class AppCmp {}

Child Component
@Component({
  selector: 'left-control',
  templateUrl: 'sidebar.component.html',
  moduleId: module.id,
  directives: [ROUTER_DIRECTIVES],
})
@RouteConfig([
  {path: '/',name: 'Data',component: SelectDataComponent,useAsDefault: true},
  {path: '/dates',name: 'Dates',component: SelectDatesComponent},
  {path: '/edit/paths',name: 'EditPaths',component: EditPathsComponent},
  {path: '/edit/filters',name: 'EditFilters',component: EditFiltersComponent}
])
export class SideNavComponent{}

```

คำตอบ #1

ฉันยังไม่ได้ลองทุกวิธีเหล่านี้ แต่ฉันคิดว่ามันควรจะใช้ได้:

import {Router} from 'angular2/router'

...

constructor(private router:Router) {}

someMethod() {
  this.router.parent.navigate(['About']);
  this.router.navigate(['/About']);
  this.router.navigate(['../About']);
}

ด้วย [routerLink]="..." มันทำงานเหมือนกัน (ยกเว้นตัวอย่างแรก)