文件夹结构

app
  |--home/
  |    |--home.component.ts
  |--login/
  |    |--login.ts
  |--appShell/
  |    |--app.component.ts
  |--apps/
       |--hero/
            |--hero-shell.component.ts  
            |--horees.component.ts 
            |--hero-detail.component.ts

计划的导航是

app.component -> home.component -> heroshell.component -> heroes.component

app.component.ts路线

@Routes([
    { path: '/heroshell',component: HeroShellComponent },{ path: '/home',component: HomeComponent },{ path: '/login',component: Login },])
export class AppComponent implements OnInit {
  title = 'Apps';       
  constructor(public _auth: Authentication,public router: Router,private _dialogService: DialogService
              ) {}      
  ngOnInit() {
    this.router.navigate(['/login']);
  }
  .......

登录成功后,Login类将会

this.router.navigate(['/home']);

从HomeComponent.ts我可以做到

this.router.navigate(['/heroshell']);

到目前为止这么好,没问题.
在hero-shell.component.ts中我有子路由

@Component({
  selector: 'my-app1',templateUrl: 'app/apps/hero/hero-shell.component.html',styleUrls: ['app/appshell/app.component.css'],directives: [ROUTER_DIRECTIVES],providers: [HeroService]
})

@Routes([
    { path: 'heroes',component: HeroesComponent },{ path: 'dashboard',component: DashboardComponent },{ path: 'hero/:_id',component: HeroDetailComponent},])
export class HeroShellComponent { // implements OnInit
  title = 'Hero Sample App';

  constructor(public _auth: Authentication,public router: Router
              ) {} 
}

在hero-shell.component.html中

<my-app1>

<h1>{{title}}</h1>
<!--<button *ngIf="_auth.loggedIn" (click)="onlogout()">logout</button>-->

<nav>
    <a [routerLink]="['dashboard']">Dashboard</a>
    <a [routerLink]="['heroes']">Heroes</a>
</nav>
<router-outlet></router-outlet>

</my-app1>

请注意,路径只能是“英雄”.如果我改为[routerLink]并且@Routes改为’/ heroes’则不行.可以帮助解释一下原因吗？

因此它现在可以识别儿童路线.点击routerLink英雄将显示英雄列表.但是当我从HeroesComponent中详细介绍它时

this._router.navigate(['hero/'+hero._id]);

它爆炸了

browser_adapter.ts:78 EXCEPTION: Error: Uncaught (in promise): 
Cannot match any routes. Current segment: 'hero'. 
Available routes: ['/heroshell','/home','/login'].

这很奇怪.如果它无法识别儿童路线,我怎么能首先进入HeroesComponent？现在儿童路线刚刚消失.

如果我使用

this._router.navigate(['hero/'+hero._id],this.currSegment);

它会给出不同的错误

browser_adapter.ts:78 EXCEPTION: 
Error: Uncaught (in promise): Component 'HeroesComponent' does not have route configuration

那么这是否意味着所有子组件必须重复使用@Routes？