2016-07-31 18 views
1

Ich möchte Http mit einer benutzerdefinierten Klasse überschreiben, sagen HttpClient, einige Operationen vor einer Anfrage und nach einer Antwort zu tun, aber ich möchte nicht daran zu erinnern, zu importieren diese Klasse anstelle der Plattform http-Klasse.Angular 2 - Verwenden von "Multi" -Provider zum Überschreiben von Http

Ich habe experimentiert, dies über die "Multi" -Anbieter zu tun, aber ich kann es nicht richtig klicken.

Hier ist meine Klasse überschreiben:

import {Injectable} from '@angular/core'; 
import {Http, Headers} from '@angular/http'; 

@Injectable() 
export class HttpClient { 
    private http: Http; 

    constructor(http: Http) { 
    this.http = http; 
    } 

    get(url) { 
    let headers = new Headers(); 
    doSomethingToHeader(headers); 
    return this.http.get(url, { 
     headers: headers 
    }); 
    } 
} 

Und hier ist mein main.ts

bootstrap(AppComponent, [ 
    provide(HTTP_PROVIDERS, {useExisting: HTTP_PROVIDERS, multi: true}), 
    provide(HTTP_PROVIDERS, {useClass: HttpClient, multi: true}) 
]); 

Aber wenn ich versuche http.get() aufzurufen, in meiner app, ich

ORIGINAL EXCEPTION: No provider for Http! 

Irgendwelche Ideen? Gehe ich in die falsche Richtung?

Danke!

UPDATE

fand ich diese blog post. Es beschreibt ziemlich genau das, was Gunter unten beschreibt. Ich akzeptiere seine Antwort.

Antwort

2

multi: true funktioniert nur, wenn der Anbieter ein multi Provider wie PLATFORM_DIRECTIVES sein soll. HTTP_PROVIDERS sind keine multi Anbieter, sondern nur eine Sammlung einzelner Anbieter.

Was können Sie tun, ist

bootstrap(AppComponent, [HTTP_PROVIDERS, {provide: Http, useClass: HttpClient}]) 

Ergebnisse in Zyklen (siehe Kommentare)

Diese Arbeit sollte:

bootstrap(AppComponent, [ 
    HTTP_PROVIDERS, 
    { 
    provide: Http, 
    useFactory: (backend, defaultOptions) => new HttpClient(new Http(backend, defaultOptions)), 
    deps: [XHRBackend, RequestOptions] 
    } 
]) 

Der wichtige Teil ist, dass Ihre benutzerdefinierten Provider, überschreibt der in HTTP_PROVIDERS definierte Provider kommt nach der auf Sie möchten überschreiben. Deshalb ist es wichtig, dass HTTP_PROVIDERS vor {provide: Http, ...}

Mit multi: true kommen Sie nicht über einen Provider außer Kraft setzen, sondern ein anderes Element zu einem Anbieter hinzufügen, die eine Reihe von Werten zur Verfügung stellt.

+0

Ich habe das versucht, aber ich bekomme eine zyklische Abhängigkeit. Gibt es eine spezielle Möglichkeit, diese zu importieren, um this.http.get() in einem Service/einer Komponente zu verwenden, nachdem Sie den Provider so deklariert haben? –

+0

Bitte geben Sie weitere Details an. Was ist die genaue Fehlermeldung? –

+0

ORIGINAL EXCEPTION: Kann zyklische Abhängigkeit nicht instanziieren! (Http -> Http) –