Angular 2: How to redirect route to child route with named outlet

Question

I´m having a problem with Angular 2 router. I cannot get it to redirect to a specific child route with a named outlet. I think it´s a problem of URL encoding. I hope someone can help me. This is my routes setup:

const appRoutes: Routes = [
  { 
    path: 'browse',                
    component: BrowseComponent, 
    children: [
      { 
        path: 'first', 
        component: BrowseFirstComponent,
        outlet: 'view'
      },
      { 
        path: 'second', 
        component: BrowseSecondComponent,
        outlet: 'view'
      },
      { 
        path: 'third', 
        component: BrowseThirdComponent, 
        outlet: 'view'
      },
    ] 
  },
  { path: 'search', component: SearchComponent },
  { path: '',       redirectTo: '/browse/(view:first)', pathMatch: 'full' },
];

If I navigate to http://mysrv/browse/(view:first) manually (per typing in the url), it works fine. But if I naviagte to http://mysrv/ instead the router tries to redirect me to 'browse/(view%3Afirst)' which does not work:

EXCEPTION: Uncaught (in promise): Error: Cannot match any routes: 'browse/(view%3Afirst)'

I´m using Angular 2.0.0 and router Package 3.0.0

Can somebody help me please?

Answer 1

You need to update to a more recent Angular2 and Router version.

This is a known issue that is fixed since about 2 weeks.

https://github.com/angular/angular/issues/12740