How to inject HttpClient in static method or custom class?
You can also skip the injector if you don't have one. That means doing the 'injecting' yourself. I don't recommend doing this. If you really want to use a static method (in favor of a proper service), pass all the needed stuff.
I'm not sure if this isn't already obvious but any HTTP interceptor will be missing from this httpClient pipeline, since there's no way of resolving them.
import { HttpClient, HttpXhrBackend } from '@angular/common/http';
const httpClient = new HttpClient(new HttpXhrBackend({ build: () => new XMLHttpRequest() }));
httpClient.get('test').subscribe(r => console.log(r));
or using your own created injector (if you don't like passing ctor args):
const injector = Injector.create({
providers: [
{ provide: HttpClient, deps: [HttpHandler] },
{ provide: HttpHandler, useValue: new HttpXhrBackend({ build: () => new XMLHttpRequest }) },
],
});
const httpClient: HttpClient = injector.get(HttpClient);
httpClient.get('test').subscribe(r => console.log(r));
I'm not exactly sure why it does not work the way you tried (probably something missing when you create the injector), but it works if you use an 'injected' injector
If you look at the source code throwing the error you see that it mentions handlers for the request, which seems to be null in your example. Maybe angular registers some internal handlers when the HttpClient is provided the 'traditional' way, but not the way you do it
// Start with an Observable.of() the initial request, and run the handler (which
// includes all interceptors) inside a concatMap(). This way, the handler runs
// inside an Observable chain, which causes interceptors to be re-run on every
// subscription (this also makes retries re-run the handler, including interceptors).
var /** @type {?} */ events$ = rxjs_operator_concatMap.concatMap.call(rxjs_observable_of.of(req), function (req) { return _this.handler.handle(req); });
Work around:
app.module.ts
import {Injector} from '@angular/core';
export let InjectorInstance: Injector;
export class AppModule
{
constructor(private injector: Injector)
{
InjectorInstance = this.injector;
}
}
Your static class/method
import {InjectorInstance} from './app.module';
export class SomeNotInjectableService {
static doSomething()
{
/* const injector = Injector.create({
providers: [{provide: HttpClient, deps:[]}]
});
const httpClient: HttpClient = injector.get(HttpClient);
*/
const httpClient = InjectorInstance.get<HttpClient>(HttpClient);
httpClient.request(...)...
}
}
Example on Stackblitz: https://stackblitz.com/edit/angular-li8b37?file=app%2Fapp.component.ts
base on Andrew answer. If you want to use interceptors in this this httpClient pipeline, add two redefined classes from angular repo http/src/interceptor.ts and http/src/module.ts:
class HttpInterceptorHandler implements HttpHandler {
constructor(private next: HttpHandler, private interceptor: HttpInterceptor) {}
handle(req: HttpRequest<any>): Observable<HttpEvent<any>> {
return this.interceptor.intercept(req, this.next);
}
}
class HttpInterceptingHandler implements HttpHandler {
private chain: HttpHandler|null = null;
private httpBackend:HttpHandler;
constructor(private injector: Injector) {
this.httpBackend = new HttpXhrBackend({ build: () => new XMLHttpRequest });
}
handle(req: HttpRequest<any>): Observable<HttpEvent<any>> {
if (this.chain === null) {
const interceptors = this.injector.get(HTTP_INTERCEPTORS, []);
this.chain = interceptors.reduceRight((next, interceptor) => new HttpInterceptorHandler(next,interceptor),this.httpBackend);
}
return this.chain.handle(req);
}
}
Interceptors need without @Injectable decorator:
class HttpIntersept implements HttpInterceptor{
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
console.log(req.urlWithParams);
return next.handle(req)
}
}
And like Andrew was say
const injector = Injector.create({
providers: [
{ provide: HTTP_INTERCEPTORS, useClass: HttpIntersept, multi: true, deps: []},
{ provide: HTTP_INTERCEPTORS, useClass: HttpIntersept2, multi: true, deps: []},
{ provide: HttpHandler, useClass:HttpInterceptingHandler,deps [Injector,HTTP_INTERCEPTORS]},
{ provide: HttpClient, deps: [HttpHandler] }
],
});