Picture a scenario where there is a component (some.component.ts
) in Angular 16 that retrieves the value for its foo
property from activeRoute
, specifically from the parent route. Take a look at the code snippet below:
@Input() foo!: string;
constructor(private activeRoute: ActivatedRoute) {
this.foo = this.activeRoute.parent?.snapshot.params['foo'];
}
I want to utilize the Angular 16 input binding for routing parameters in this situation. It functions fine in other instances, but I am unsure about how to make it work when the parameter is inherited from a parent route.
The structure of the routes appears as follows:
{
path: 'bar/:foo',
component: IrrelevantComponent,
children: [
{
path: 'some',
component: SomeComponent,
},
],
},
Can we achieve this using the new route parameter binding feature? If so, how can it be done?