2016-06-12 15 views
0

ich eine Klasse haben, dass, wenn instanziiert einige Web-Service-Aufrufe macht, Pseudo-Code unten:prüft wird, ob rxjs beobachtbar ist komplett

Rx.Observable.fromPromise(jQuery.getJSON('https://api.github.com/users')) 
.flatMap(function() { 
    return Rx.Observable.fromPromise(jQuery.getJSON('https://api.github.com/users')); 
}); 

Die gleiche Klasse für ein Onclick-Ereignis hört.

Wenn diese selbst ausgelöst wird, wenn die ursprünglichen Anrufe Web-Service sind vollständig:

etwas tun, wenn sie nicht abgeschlossen sind, warten, bis sie, abgeschlossen ist, bevor etwas zu tun.

Ich fragte mich, wie man das mit dem Ansatz von rxjs erreichen könnte? anstatt Variablen zu setzen und if-Anweisungen zu verwenden.

+1

verwenden Können Sie bitte ein Marmorbild des beabsichtigten Verhalten angeben? Beispiele für Marmordiagramme hier; rxmarmor.com. Dies stellt im Grunde die Eingaben und die erwarteten Ausgaben auf einer Zeitleiste dar. – user3743222

Antwort

0

Ich würde dies als Asynchronous Gate bezeichnen. Diese sind eigentlich ziemlich einfach mit Rx zu tun. Sie müssen die beobachtbaren Sequenzen der Webdienstaufrufe zwischenspeichern. Dann in anderen Aufrufen, die auf diese abgeschlossen sind, Sie einfach flatMap aus ihren Ergebnissen. Da diese von Promises sind, glaube ich, dass das Ergebnis für späte Abonnenten beibehalten wird, aber wenn nicht, dann müssen Sie nur replay(1) die Sequenzen.

So in psudeo Code

var startUpData = Rx.Observable.fromPromise(jQuery.getJSON('https://api.github.com/users')) 
.flatMap(function() { 
    return Rx.Observable.fromPromise(jQuery.getJSON('https://api.github.com/users')); 
}); 

var events = Rx.Observable....//Your event wired up here. 

//When an event 
events 
    .flatMap(function(evt){ 
     //Wait until the startUpData yeilds, but pass on the evt data instead. 
     return startUpData.map(function(){ return evt;}) 
//do something here knowing that your event has fired, but the web services have also completed. 
    .subscribe(); 

können Sie sehen, Matt Barrett ein Async Tor in diesem Video bei etwa 51 Minuten in diesem Video erklären - https://youtu.be/Tp5mRlHwZ7M?t=51m30s

Sie können auch die switch Operator einhüllen berücksichtigen Sie wollen keine überlappenden Ereignisse

0

Ich glaube, withLatestFrom oder combineLatest wird tun, was Sie fragen.

Je nachdem, ob Sie die Schaltfläche nur einmal mit den vom Dienst bereitgestellten Daten zulassen möchten, können Sie withLatestFrom verwenden. Wenn Sie die Taste, um weiterhin zu ermöglichen, möchten die Daten angeklickt werden, der zuvor von dem Service können Sie combineLatest

const futureEvent$ = Rx.Observable.timer(3000); 
const btnClick$ = Rx.Observable 
    .fromEvent(document.querySelector('button'), 'click'); 
const futureAndBtnClick$ = futureEvent$.combineLatest(btnClick$); 

futureAndBtnClick$.subscribe(x => console.log('click + future stuff happened')); 

jsbin example

Verwandte Themen