it-swarm.com.de

Promise.all Verhalten mit RxJS Observables?

In Angular 1.x musste ich manchmal mehrere http Anfragen stellen und mit allen Antworten etwas anfangen. Ich habe alle Versprechen in ein Array geworfen und Promise.all(promises).then(function (results) {...}).

Angular 2-Best Practices scheinen auf die Verwendung von Observable von RxJS als Ersatz für Versprechen in http -Anfragen hinzuweisen. Wenn ich zwei oder mehr verschiedene Observables aus http-Anfragen erstellen lasse, entspricht das Promise.all()?

67
Corey Ogburn

Die einfachere Alternative zum Emulieren von Promise.all soll den Operator forkJoin verwenden (alle Observablen werden parallel gestartet und die letzten Elemente werden verbunden):

Ein bisschen außerhalb des Rahmens, aber falls es beim Verketten von Versprechungen hilft, können Sie ein einfaches flatMap verwenden: vgl. RxJS Promise Composition (Datenübergabe)

66
user3743222

forkJoin funktioniert auch gut, aber ich würde es vorziehen, compressLatest , da Sie sich nicht darum kümmern müssen, den letzten Wert von Observablen zu nehmen. Auf diese Weise können Sie immer dann aktualisiert werden, wenn einer von ihnen ebenfalls einen neuen Wert ausgibt (z. B. wenn Sie ein Intervall oder etwas abrufen).

12
kakigoori

Am reactionx.io forkJoin zeigt eigentlich auf Zip , was den Job für mich gemacht hat:

let subscription = Observable.Zip(obs1, obs2, ...).subscribe(...);
11
Arnaud P

pdate Mai 2019 mit RxJs v6

Fanden die anderen Antworten nützlich und wollten ein Beispiel für die von Arnaud angebotene Antwort zur Verwendung von Zip geben.

Hier ist ein Ausschnitt, der die Entsprechung zwischen Promise.all und die rxjs Zip (beachten Sie auch, dass Zip in rxjs6 jetzt mit "rxjs" & nicht als Operator importiert wird).

import { Zip } from "rxjs";

const the_weather = new Promise(resolve => {
  setTimeout(() => {
    resolve({ temp: 29, conditions: "Sunny with Clouds" });
  }, 2000);
});

const the_tweets = new Promise(resolve => {
  setTimeout(() => {
    resolve(["I like cake", "BBQ is good too!"]);
  }, 500);
});

// Using RxJs
let source$ = Zip(the_weather, the_tweets);
source$.subscribe(([weatherInfo, tweetInfo]) =>
  console.log(weatherInfo, tweetInfo)
);

// Using ES6 Promises
Promise.all([the_weather, the_tweets]).then(responses => {
  const [weatherInfo, tweetInfo] = responses;
  console.log(weatherInfo, tweetInfo);
});

Die Ausgabe von beiden ist gleich. Wenn Sie das oben genannte ausführen, erhalten Sie:

{ temp: 29, conditions: 'Sunny with Clouds' } [ 'I like cake', 'BBQ is good too!' ]
{ temp: 29, conditions: 'Sunny with Clouds' } [ 'I like cake', 'BBQ is good too!' ]
6
arcseldon