I want to use ActivatedRoute to get route params in a service like I would do in a Component. However, when I inject the ActivatedRoute object in a Service it contains an empty params variable
I've created a plunker that reproduces the behaviour: http://plnkr.co/edit/sckmDYnpIlZUbqqB3gli
Note that the intention is to use the parameter in the service and not in the component, the way the plunker is set up is purely to demonstrate the issue.
Component (test
is retrieved):
export class Component implements OnInit { result: string; constructor(private route: ActivatedRoute) { } ngOnInit() { this.route.params.subscribe(params => { this.result = params['test']; }); } }
Service (test
is not retrieved):
export class Service { result: string; constructor(private route: ActivatedRoute) { this.getData(); } getData() { this.route.params.subscribe(params => { this.result = params['test']; }); } }
Service is a singleton. ActivatedRoute is not. I guess that ActivatedRoute instances are just different in Component and Service. @estus Makes sense, I could pass the param to the service via a function.
Step 1: Import ActivatedRoute from Router module. import { ActivatedRoute } from '@angular/router'; Step 2: Inject ActivatedRoute in constructor. Now we have id in edit_quiz.
ActivatedRoutelink. Provides access to information about a route associated with a component that is loaded in an outlet. Use to traverse the RouterState tree and extract information from nodes.
Service
here is a singleton that belongs to root injector and is injected with root ActivatedRoute
instance.
Outlets get their own injector and own ActivatedRoute
instance.
The solution here is to let route components have their own Service
instances:
@Component({ ... providers: [Service] }) export class MainComponent { ... }
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With