Website-Suche

Drei RxJS-Observables mit Ergebnissabhängigkeiten in TypeScript und Angular 4 verketten und zusammenführen, ohne zu verschachteln

Ich habe 3 Observables, die ich verketten muss, das Ergebnis des ersten wird in den anderen 2 verwendet. Sie müssen in der Reihenfolge ausgeführt werden und jedes muss auf das vorherige warten. Ist es möglich, sie zu verketten, ohne zu verschachteln?

public observable1(): Observable<Response> {
    let headers = new Headers();
    headers.append("Content-Range", "bytes */*");
    let requestOptions = new RequestOptions({headers: headers});
    return this.http.put(url, "", requestOptions);
}

public observable2(data1url): Observable<Response> {
    let headers = new Headers();
    headers.append("Content-Range", "bytes */*");
    let requestOptions = new RequestOptions({headers: headers});
    return this.http.put(data1url, "", requestOptions);
}

public observable3(data1url): Observable<Response> {
    let headers = new Headers();
    headers.append("Content-Range", "bytes */*");
    let requestOptions = new RequestOptions({headers: headers});
    return this.http.put(data1url, "", requestOptions);
}

Dies ist der einzige Weg, den ich gefunden habe, sie zu verketten, aber sie sind immer noch verschachtelt. Ist es möglich, dies zu tun und sie nicht zu verschachteln?

public doHttpProcess() {
    return this.observable1().concatMap(result1 => {
        return this.observable2(result1.json().data1)
            .concatMap(result2 => {
                return this.observable3(result1.json().data1);
            });
    });
}

Vielen Dank für Ihre Hilfe

Antwort #1

Du bist fast am Ziel, du musst nur die zweite Verschachtelung entfernen und du kannst die concatMap-Aufrufe ketten

public doHttpProcess() {
    return this.observable1()
      .concatMap(result1 => this.observable2(result1.json().data1).map(result2 => ({ result1, result2 }))
      .concatMap(({ result1, result2 }) => this.observable3(result1.json().data1));
}

Und wenn Sie result2 nicht benötigen, um das letzte Observable zu erzeugen, können Sie es vereinfachen zu

public doHttpProcess() {
    return this.observable1()
      .concatMap(result1 => this.observable2(result1.json().data1).mapTo(result1))
      .concatMap(result1 => this.observable3(result1.json().data1));
}

Verwandte Artikel