2016-06-12 16 views
28

Ich lerne RxJS und Angular 2. Lassen Sie uns sagen, dass ich ein Versprechen Kette mit mehreren Asynchron-Funktionsaufrufe haben, die auf dem vorherigen Ergebnis abhängen, die wie folgt aussieht:Chaining Observable in RxJS

var promiseChain = new Promise((resolve, reject) => { 
    setTimeout(() => { 
    resolve(1); 
    }, 1000); 
}).then((result) => { 
    console.log(result); 

    return new Promise((resolve, reject) => { 
    setTimeout(() => { 
     resolve(result + 2); 
    }, 1000); 
    }); 
}).then((result) => { 
    console.log(result); 

    return new Promise((resolve, reject) => { 
     setTimeout(() => { 
     resolve(result + 3); 
     }, 1000); 
    }); 
}); 

promiseChain.then((finalResult) => { 
    console.log(finalResult); 
}); 

Meine Versuche tun die gleichen ausschließlich mit RxJS ohne die Verwendung von Versprechungen erzeugt folgendes:

var observableChain = Observable.create((observer) => { 
    setTimeout(() => { 
    observer.next(1); 
    observer.complete(); 
    }, 1000); 
}).flatMap((result) => { 
    console.log(result); 

    return Observable.create((observer) => { 
    setTimeout(() => { 
     observer.next(result + 2); 
     observer.complete() 
    }, 1000); 
    }); 
}).flatMap((result) => { 
    console.log(result); 

    return Observable.create((observer) => { 
    setTimeout(() => { 
     observer.next(result + 3); 
     observer.complete() 
    }, 1000); 
    }); 
}); 

observableChain.subscribe((finalResult) => { 
    console.log(finalResult); 
}); 

Es ergibt sich die gleiche Ausgabe wie die Versprechen Kette. Meine Fragen sind

  1. Mache ich das richtig? Gibt es irgendwelche RxJS-bezogenen Verbesserungen, die ich an dem obigen Code vornehmen kann?

  2. Wie bekomme ich diese beobachtbare Kette wiederholt auszuführen? das heißt ein weiteres Abonnement am Ende Hinzufügen erzeugt nur einen zusätzlichen 6 obwohl ich es 1, 3 und 6.

    observableChain.subscribe ((finalResult) => { console.log (finalResult); }) drucken erwarten;

    ObservableChainScribe ((finalResult) => { console.log (finalResult); });

Antwort

21

über Versprechen Zusammensetzung vs. Rxjs, da dies eine häufig gestellte Frage ist, Sie zu einer Reihe verweisen vorher Fragen auf SO gefragt, unter anderem:

Grundsätzlich ist flatMap das Äquivalent von Promise.then.

Für Ihre zweite Frage, möchten Sie bereits emittierte Werte wieder abspielen oder möchten Sie neue Werte verarbeiten, wenn sie ankommen? Überprüfen Sie im ersten Fall den Operator publishReplay. Im zweiten Fall genügt ein Standardabonnement. Allerdings müssen Sie sich der Kälte bewusst sein. vs. Heißdichotomie abhängig von Ihrer Quelle (vgl. Hot and Cold observables : are there 'hot' and 'cold' operators? für eine illustrierte Erläuterung des Konzepts)

Verwandte Themen