I've been hours now trying to figure out how to correctly inject the URLSearchParams
dependency into a component.
In my boot.ts
I'm making sure to include HTTP_PROVIDERS
- I'm honestly not even sure it's required for URLSearchParams
.
I've also ensured that I'm including the http bundle script in my page.
boot.ts
bootstrap(AppComponent, [
HTTP_PROVIDERS,
ROUTER_PROVIDERS,
provide(LocationStrategy, {useClass: HashLocationStrategy}),
PanelsService,
FiltersService
])
It is FiltersService
where I'm attempting to inject URLSearchParams
.
filter.service.ts
import {Component, Injectable} from 'angular2/core';
import {URLSearchParams} from 'angular2/http';
@Injectable()
export class FiltersService {
constructor(private _searchParams:URLSearchParams) { }
setFilter(name, value) {
this._searchParams.set(name, value);
}
getFilter(name) {
this._searchParams.get(name);
}
}
Injecting URLSearchParams
in the constructor causes the error:
I've read this article, a couple of times in fact and can't figure out where I'm going wrong.
For what it's worth, I encounter the same problem when attempting to inject RouteParams
. I'm clearly missing something fundamental.
EDIT: For some more clarity, this is what my StoriesComponent
looks like:
import {Component, OnInit} from 'angular2/core';
import {PanelsService} from '../panels/panels.service';
import {RouteParams} from 'angular2/router';
import {FiltersService} from '../common/filters.service';
@Component({
selector: 'stories',
templateUrl: 'app/components/stories/stories.component.html'
})
export class StoriesComponent implements OnInit {
constructor(public panelsService:PanelsService,
public filtersService: FiltersService,
private _routeParams:RouteParams) {
this.panelsService.setSelectedPanel(this._routeParams.params['panelId']);
}
ngOnInit() {
console.log('Stories');
}
addPanel() {
var newPanel = {
id: 999,
name: 'my new panel name',
time: 744
// time: 168
}
this.panelsService.addPanel(newPanel);
}
}
EDIT 2: Here's a plunk which demonstrates my issue - see peopleService.ts