Router store does not recognize router params

Question

We have the following routing scenario:

export const ROUTES: Routes = [
  {
    path: ':userId',
    component: fromContainers.OrganizationComponent,
    canActivate: [],
    children: [
      { path: '', pathMatch: 'full', redirectTo: 'posts' },
      {
        path: 'posts',
        loadChildren: './views/posts/posts.module#PostsModule'
      }
    ]
  }
];

Our router store does not recognize userId this way but when we remove the children property it does recognize the value of userId.

http://localhost:4200/user/r1RORssFG --> WORKS
http://localhost:4200/user/r1RORssFG/posts --> DOES NOT WORK

What is the reason behind this behavior?

Answer 1

I think you are unable to access params of a parent route from a child route.

To access parent params from child component:

Use this._route.parent.params instead of this._route.params

where this._route is private _route: ActivatedRoute

Answer 2

Based on the hint from Jota.Toledo ,The solution was to define a routing configuration where I use Router.forRoot() like this:

export const routingConfiguration: ExtraOptions = {
  paramsInheritanceStrategy: 'always'
};

and then

RouterModule.forRoot(routes,routingConfiguration),