/ / Manejo de dos observables en canDeactivate - angular, mecanografiado, observable

Manejo de dos observables en canDeactivate - angular, mecanografiado, observable

En mi canDeactivate () guarda de ruta, estoy llamando aModal que tiene dos botones: ok y cancelar. Quiero devolver verdadero si se hace clic en el botón Aceptar para que el usuario pueda continuar abandonando la página, y devuelva falso si se hace clic en el botón Cancelar. Aquí está mi código actual:

canDeactivate(component: ComponentCanDeactivate): boolean | Observable<boolean> {
let can =  component.canDeactivate();
//let result = new Observable<boolean>();
let okResult = new Observable<boolean>();
let cancelResult = new Observable<boolean>();

if (!can) {
component.myChangesModal.show("Warning", "You are about to leave this page with unsaved changes.");

okResult = component.myChangesModal.okEvent.map(() => true);
//okResult.subscribe();

cancelResult = component.myChangesModal.cancelEvent.map(() => false);
//cancelResult.subscribe();
console.log(okResult);
console.log(cancelResult);

const observablesArray = [okResult, cancelResult];

let result = Observable.combineLatest.apply(this, observablesArray).take(1);
result.subscribe();

return result;
}
return true;
}

Inicialmente al probar esto, solo tuve unsolo observable para comprobar cuándo se llama el botón Aceptar, y luego se suscribirá a eso y devolverá el resultado. Esto funcionó, sin embargo, solo funcionó para un botón y, al hacer clic en el botón Cancelar, se rompió todo. Aquí está lo que inicialmente tenía que funcionaba perfectamente para un solo botón.

canDeactivate(component: ComponentCanDeactivate): boolean | Observable<boolean> {
let can =  component.canDeactivate();
let result = new Observable<boolean>();

if (!can) {
component.myChangesModal.show("Warning", "You are about to leave this page with unsaved changes.");

result = component.myChangesModal.okEvent.map(() => true);
result.subscribe();

return result;
}
return true;
}

¿Qué estoy haciendo mal al intentar que mi canDeactivate modal funcione con más de un observable, y qué debo hacer?

Respuestas

4 para la respuesta № 1

CombineLatest esperará hasta que ambos observables emitan un valor. Eso nunca pasa por tu caso. Usted quiere Observable.merge en lugar.

return okResult.merge(cancelResult).take(1)

o

return Observable.merge(okResult, cancelResult).take(1)