How to read query parameters in a APP_INITIALIZER service in angular4?

Viewed 5394

I have a ConfigService written to get the configuration details before the angular app bootstraps.

The following code is written in the app.module.ts this code works fine and I am able to load the configs before the app loads.

...
providers: [
    {
        provide: APP_INITIALIZER,
        useFactory: configServiceFactory,
        deps: [ConfigService],
        multi: true
    }
]
...

However, now I wanted to pass a payload to my config API which I have to read from the query parameters.

I tried the following but it throws

...
@Injectable()
export class ConfigService {

    private _configData: any;

    constructor(
        private _http: Http,
        private _activatedRoute: ActivatedRoute
) {
}
...

How do I read the query-parameters inside an APP_INITIALIZER service?

3 Answers

FWIW, All the methods you need are already provided on the window object.

I recently had to check whether a query parameter of foo was passed on the URL. Here is what I ended up doing:

export class ConfigService {
    constructor(/* your dependencies */) {
        // remember that your dependencies must be manually added
        // to your deps: [] property, ALL OF THEM (direct and indirect)
    }

    initialize() {
        // remember that constructors should not contain business logic
        // instead, call this during the APP_INITIALIZER part

        const url = new URL(window.location.href);
        const foo = url.searchParams.get('foo');

        // your business logic based on foo
    }
}

URL seems to be fairly well supported.

If you want to stick with the Angular way, I would say to use a resolver. Read more here

Related