Unable to inject ActivatedRouteSnapshot

Question

Injecting ActivatedRouteSnapshot into a component is not working (and neither is injecting ActivatedRoute). Here the stack trace:

"Error: Can't resolve all parameters for ActivatedRouteSnapshot: (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?). at SyntaxError.ZoneAwareError (http://localhost:4200/polyfills.bundle.js:7042:33) at SyntaxError.BaseError [as constructor] (http://localhost:4200/vendor.bundle.js:73735:16) at new SyntaxError (http://localhost:4200/vendor.bundle.js:6140:16) at CompileMetadataResolver._getDependenciesMetadata (http://localhost:4200/vendor.bundle.js:19345:31) at CompileMetadataResolver._getTypeMetadata (http://localhost:4200/vendor.bundle.js:19220:26) at CompileMetadataResolver._getInjectableMetadata (http://localhost:4200/vendor.bundle.js:19208:21) at CompileMetadataResolver.getProviderMetadata (http://localhost:4200/vendor.bundle.js:19450:40) at http://localhost:4200/vendor.bundle.js:19408:49 at Array.forEach (native) at CompileMetadataResolver._getProvidersMetadata (http://localhost:4200/vendor.bundle.js:19375:19) at CompileMetadataResolver.getNonNormalizedDirectiveMetadata (http://localhost:4200/vendor.bundle.js:18848:30) at CompileMetadataResolver._loadDirectiveMetadata (http://localhost:4200/vendor.bundle.js:18736:23) at http://localhost:4200/vendor.bundle.js:18937:54 at Array.forEach (native) at CompileMetadataResolver.loadNgModuleDirectiveAndPipeMetadata (http://localhost:4200/vendor.bundle.js:18936:41)" 

---

In the component, ActivatedRouteSnapshot is injected as follows:

constructor([...], private router: Router,           private route: ActivatedRouteSnapshot) {     [...] } 

---

ActivatedRouteSnapshot is provided in app.component.ts:

@Component({     selector: 'app-root',     templateUrl: './app.component.html',     styleUrls: ['./app.component.css'],     providers: [[...], ActivatedRouteSnapshot] }) 

---

I'm trying to access the query params similarly to how it is done here: https://stackoverflow.com/a/38997116/3433306

According to the docs it should be as simple as adding it to the constructor parameters: https://angular.io/docs/ts/latest/api/router/index/ActivatedRouteSnapshot-interface.html

What am I missing to successfully inject ActivatedRouteSnapshot?

Answer 1

Use ActivatedRoute instead of ActivatedRouteSnapshot. Then you can use the snapshot like this:

constructor(activatedRoute: ActivatedRoute) {    var snapshot = activatedRoute.snapshot; }