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 useAsDefaults 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.