ciptohadi79 ciptohadi79 - 4 years ago 686
Javascript Question

Angular2 useAsDefault not work for child route

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 Source

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

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.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download