Zwei angular2 Dienste gleich beobachtbare

Question

Ich habe zwei angular2 Dienstleistungen, eine Bereitstellung von Daten

@Injectable() 
export class DataService { 

constructor(private http: Http) { } 

public getData(): Observable<Data> { 
    return this.http.get('/api/foo') 
     .map(res => new Data(res.json().data)); 
} 

und eine Bereitstellung von Einstellungen

@Injectable() 
export class SettingsService { 

constructor(private http: Http) { } 

public getSettings(): Observable<Settings> { 
    return this.http.get('/api/foo') 
     .map(res => new Settings(res.json().settings)); 
} 

Die Antwort/api/foo

{ 
    "settings": { 
     ... 
    } 
    "data": { 
     .... 
    } 
} 

ist

Diese Dienste verwenden beide denselben api-Aufruf, um ihren Inhalt abzurufen, und der Aufruf an den Server wird für dasselbe zweimal ausgeführt Daten.

Ich weiß, dass die vorhandene API nicht ideal ist, um sowohl Daten als auch Einstellungen in einer Nachricht zu kombinieren und eventuell ersetzt werden muss.

In der Zwischenzeit ist meine Frage: Mit der vorhandenen API gibt es eine direkte Möglichkeit, einen Datendienst und einen Einstellungsdienst zur Verfügung zu stellen, die denselben api Anruf teilen? Kann es einen Anruf bei der API geben, die Daten an beide Dienste liefert, oder muss jeder Dienst unabhängig arbeiten?

UPDATE: Meine Gedanken so weit sind, dass ich einen Basisdienst erstellen muß, die den tatsächlichen http Anruf tätigt, diese FooService nennen. FooService muss dann sowohl in SettingsService als auch in DataService eingefügt werden, die dann die Ausgabe von FooService als Einstellungen und Daten darstellen können. Wo stecke ich fest, wie gabele ich die von FooService zurückgegebene Observable<any> in zwei andere Observables, Observeable<Data> in Dataservice und Observeable<Settings> in SettingsService? Ist das überhaupt möglich?

Answer 1

Sieht so aus, als ob Sie eine Möglichkeit haben möchten, dynamisch von einem Objekt nach Schlüssel zu wählen. Suchst du danach?

public getSettings(dataKey): Observable<Settings> { 
    return this.http.get('/api/foo') 
     .map(res => new Settings(res.json()[dataKey]); 
} 

Answer 2

Ich habe herausgefunden, wie das geht. Erstellen Sie einen Dienst, um auf die API zuzugreifen, und erstellen Sie dann die Einstellungen und Datendienste mithilfe von .map() für den API-Dienst.

zuerst den Dienst erstellen, die die zugrunde liegende API zugreifen:

@Injectable() 
export class ApiService { 

    constructor(private http: Http) { } 

    public getObservable(): Observable<any> { 
     return this.http.get('/api/foo') 
      .map(res => res.json())); 
} 

dann die beiden Dienste erstellen, die das Programm verbrauchen:

@Injectable() 
export class SettingsService { 

    constructor(private api: ApiService) { } 

    public getSettings(): Observable<Settings> { 
     return this.api.getObservable() 
      .map(res => new Settings(res.settings)); 
    } 
} 

und

@Injectable() 
export class DataService { 

    constructor(private api: ApiService) { } 

    public getData(): Observable<Data> { 
     return this.api.getObservable() 
      .map(res => new Data(res.data)); 
    } 
}