javascript - example - Cómo hacer la secuencia de la cadena en rxjs
http post angular 4 (2)
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();
});
}
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.
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();
});
}