Angular2 useAsDefault not work for child route

Question

I have been playing around with Angular2 route example which has child route as default route, but the example did not navigate to that default route: https://angular.io/resources/live-examples/tutorial/ts/plnkr.html

While the tutorial of Tour of Heroes which has not child route, useAsDefault was working normally: https://angular.io/resources/live-examples/router/ts/plnkr.html

Any sollution would be appreciated. Thanks in advance

Answer 1

Apparently nested useAsDefault s don't work, I'm not aware of that behavior. Note too that the problem is the useAsDefault in the parent route, not in the child.

You can fix that issue though by adding a redirectTo .

    @RouteConfig([
      { path : '/', redirectTo : ['CrisisCenter'] }, // Here...
      { // Crisis Center child route
        path: '/crisis-center/...',
        name: 'CrisisCenter',
        component: CrisisCenterComponent
      },

      {path: '/heroes',   name: 'Heroes',     component: HeroListComponent},
      {path: '/hero/:id', name: 'HeroDetail', component: HeroDetailComponent},
      {path: '/disaster', name: 'Asteroid', redirectTo: ['./CrisisCenter', 'CrisisDetail', {id:3}]}
    ])
    export class AppComponent { }

Note that I removed the extra useAsDefault . I'll file an issue so they can fix it in the docs.

Update 2

It isn't a mistake in the docs actually, it's a bug. I got the confirmation by @wardbell. There's already an issue filed for this bug.

So according to his comment the docs won't be updated (there's nothing to update, it's a bug!).

This issue was reported [...]. I left the doc as is, hoping that it will become correct soon.

Update

Here's the issue I filed. They'll tell us if it's a mistake in the docs or not (most likely, I'll bet on that). I'll update after they answer.