Obsługa dwóch obserwowalnych w canDeactivate - kątowa, maszynopisowa, obserwowalna

W moim monitorze trasy canDeactivate () dzwonię do amodalny, który ma dwa przyciski: ok i anuluj. Chcę przywrócić wartość true, jeśli zostanie kliknięty przycisk ok, aby użytkownik mógł kontynuować opuszczanie strony i zwrócił wartość false, jeśli kliknięty zostanie przycisk anulowania. Oto mój obecny kod:

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;
}

Początkowo podczas testowania tego, miałem tylkopojedynczy obserwowalny do sprawdzenia, kiedy zostanie wywołany przycisk ok, a następnie zasubskrybuje go i zwróci wynik. To zadziałało, jednak zadziałało tylko dla jednego przycisku i kliknięcie przycisku anulowania zepsuło wszystko. Oto, co początkowo sprawdziło się idealnie tylko dla jednego przycisku.

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;
}

Co robię źle, próbując zmusić mój CanDeactivate modal do pracy z więcej niż jednym obserwowalnym i co powinienem zrobić?

Odpowiedzi:

CombineLatest będzie czekał aż oba obserwowalne wykażą wartość. To nigdy się nie zdarza w twoim przypadku. Chcesz Observable.merge zamiast.

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

lub

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