In order to dynamically apply headers and URL paths, I have created an extended HttpClass. Here is what it looks like:
custom-http.ts
export enum Type {
PREAUTH = 0,
AUTH = 1,
PRINTER = 2,
TERMINAL = 3
}
@Injectable()
export class CustomHttp extends Http {
private typesOn: Array<any> = [false, false, false, false];
constructor(backend: ConnectionBackend, defaultOptions: RequestOptions) {
super(backend, defaultOptions);
this.presetPetition(Type.AUTH);
}
presetPetition(type: number) {
this.typesOn.forEach(t => (t = false));
this.typesOn[type] = true;
}
request(url: string | Request, options?: RequestOptionsArgs): Observable<Response> {
return super.request(url, options);
}
get(url: string, options?: RequestOptionsArgs): Observable<Response> {
return super.get(this.updateUrl(url), this.getRequestOptionArgs(options));
}
private updateUrl(req: string) {
if (this.typesOn[Type.AUTH]) {
return environment.apiURL + req
} else {
return req
}
}
app.module.ts
providers: [
CustomHttp,
{
provide: Http,
useFactory: httpFactory,
deps: [XHRBackend, RequestOptions]
}
]
http.factory.ts
export function httpFactory(xhrBackend: XHRBackend, requestOptions:
RequestOptions): Http {
return new CustomHttp(xhrBackend, requestOptions);
}
When trying to change the type of HTTP request, I import CustomHttp into the component/service and call presetPetition() just before making the HTTP request.
An error message saying "No Provider for Backend Connection" is shown. I realize that redundant provider imports may be causing this issue (Http and AppHttp).
How can I access a public function in an extended class? Am I approaching this problem incorrectly?