javascript - example - Cómo hacer la secuencia de la cadena en rxjs

http post angular 4

Question

Me gustaría hacer algo como:

this._myService.doSomething().subscribe(result => {
doSomething()
});
.then( () => dosthelse() )
.then( () => dosanotherthing() )

Entonces me gustaría encadenar .entonces como en promesa. ¿Cómo haría eso en Rxjs?

this._myService.getLoginScreen().subscribe( result => {
window.location.href = MyService.LOGIN_URL;
/// I would like to wait for the site to load and alert something from the url, when I do it here it alerts the old one
});
.then (alert(anotherService.partOfTheUrl())
getLoginScreen() {
return this.http.get(myService.LOGIN_URL)
.flatMap(result => this.changeBrowserUrl())
.subscribe( result => //i want to do sth when the page is loaded//);
}
changeBrowserUrl(): Observable<any> {
return Observable.create( observer => {
window.location.href = myService.LOGIN_URL;
observer.next();
});
}

Answer 1

El equivalente de then para observables sería flatMap . Puedes ver algunos ejemplos de uso aquí:

• RxJS Promise Composition (pasar datos)
• ¿Por qué necesitamos usar flatMap?
• Secuencia RxJS equivalente a promise.then ()?

Para su ejemplo, podría hacer algo como:

this._myService.doSomething()
.flatMap(function(x){return functionReturningObservableOrPromise(x)})
.flatMap(...ad infinitum)
.subscribe(...final processing)

Preste atención a los tipos de lo que devuelven sus funciones, ya que para encadenar observables con flatMap deberá devolver una promesa u observable.

Answer 2

Si dosthelse o dosanotherthing devuelve un valor bruto, el operador a usar es map . Si es observable, el operador es flatMap (o equivalente).

Si quieres hacer algo imperativamente. Quiero decir, fuera de la cadena de procesamiento asíncrono, podrías aprovechar el operador do .

Suponiendo que dosthelse devuelve un objeto observable y dosanotherthing un objeto sin procesar, su código sería:

this._myService.doSomething()
.do(result => {
doSomething();
})
.flatMap( () => dosthelse() )
.map( () => dosanotherthing() );

Tenga en cuenta que si devuelve el método de suscripción, corresponderá a un objeto de suscripción y no a un observable. Un objeto de suscripción es principalmente para poder cancelar lo observable y no puede formar parte de la cadena de procesamiento asíncrono.

De hecho, la mayoría de las veces, te suscribes al final de la cadena.

Así que refactorizaría su código de esta manera:

this._myService.getLoginScreen().subscribe( result => {
window.location.href = MyService.LOGIN_URL;
/// I would like to wait for the site to load and alert something from the url, when I do it here it alerts the old one
alert(anotherService.partOfTheUrl()
});
getLoginScreen() {
return this.http.get(myService.LOGIN_URL)
.flatMap(result => this.changeBrowserUrl())
.do( result => //i want to do sth when the page is loaded//);
}
changeBrowserUrl(): Observable<any> {
return Observable.create( observer => {
window.location.href = myService.LOGIN_URL;
observer.next();
});
}