question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Router: Provide option to inherit data and params

See original GitHub issue

I’m submitting a … (check one with “x”)

[ ] bug report => search github for a similar issue or PR before submitting
[X] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior Current behavior of inheriting route data and params is not very clear. AFAIK it inherits when:

  • route path is empty
  • parent path doesn’t have component set

Expected behavior Please provide option to always inherit params and data. Of course it would be the best to have it as default behavior, but I understand it is not default now, and if it is not possible to make it default, I suggest those options how to do it:

  1. One possibility could be to add parameter inheritParams to route definition.

So routes would like

{
  path: 'groups/:groupId',
  component: GroupLayoutComponent,
  resolve: {
    applicationGroup: ApplicationGroupResolve
  },
  children: [
    { path: '', component: GroupPageComponent, inheritParams: true },
    { path: 'edit', component: ApplicationGroupForm, inheritParams: true },
    { path: 'applications', inheritParams: true, children: [
        { path: 'register', component: RegisterApplicationFormComponent, inheritParams: true },
        { 
	  path: ':applicationId', 
          inheritParams: true, 
          resolve: {
              application: ApplicationResolve
          },
          children: [
            { path: 'edit', component: EditApplicationFormComponent, inheritParams: true },
         ]
       }
    ]}
  ]
}

And after accessing url /groups/1/applications/2/edit ActivatedRoute.data would return:

{ 
  applicationGroup: {}, // resolved app. group from top-level route by ApplicationGroupResolve, 
  application: {} // resolved app. from last route by AppResolve
}
  1. Second (and I think better) option would be to add additional fields to ActivatedRoute, which would contain inherited data. Something like allParams and allData (all because it would contain parameters of current route + inherited parameters).

  2. Third possibility would be to add configuration option to RouterModule. (Similar as with useHash: true).

It could be something like boolean variable alwaysInherit or iheritMode with options 'always' 'default'

What is the motivation / use case for changing the behavior? Currently it is not very clear how parameters and data inheritance works. It hasn’t been documented properly.

There are already some issues (https://github.com/angular/angular/issues/12767, https://github.com/angular/angular/issues/12306) when people expect this to be working.

Also workaround to get described behavior is very complicated.

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Reactions:12
  • Comments:15 (7 by maintainers)

github_iconTop GitHub Comments

9reactions
vicbcommented, Dec 1, 2016

We do not plan to change the implementation as this is something you can implement easily according to your needs.

We look into improving the docs.

2reactions
bjesuitercommented, Oct 16, 2018

Unfortunately, paramsInheritanceStrategy does only inherit params for me. Route data is still not inherited, which produces the same problems as before with route params since I’m using route resolvers.

My route resolver loads a machine and i need this machine in a route resolver for a child component, as the child route resolver has to have some information from this machine.

Are there any plans to add data inheritance besides paramsInheritanceStrategy?

Read more comments on GitHub >

github_iconTop Results From Across the Web

Inherit Parent Route Parameters by Default with ... - Egghead.io
The paramsInheritanceStrategy defines how the router merges parameters, data, and resolved data from parent to child routes. The default is "emptyOnly," which ...
Read more >
Params inheritance strategy with Angular Router
To allow all params and data to be passed down to the child route, we can set the paramsInheritanceStrategy to always . By...
Read more >
TIL params inheritance strategy to always have access to ...
Configure the Angular router to always have access to the parent route data from within the child route.
Read more >
How to inherit props from parent route with vue-router
There's no such feature in Vue Router for passing props to child routes that way. Instead, you could use provide / inject to...
Read more >
Accessing Parent Route Params Via ...
Linear : A given route segment only has access to its own parameters and the ones that it inherits from its ancestors. A...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found