私のcanDeactivate()ルートガードでは、2つのボタンがあるモーダル:[OK]と[キャンセル]。ユーザーがページを離れ続けることができるようにOKボタンがクリックされた場合はtrueを返し、キャンセルボタンがクリックされた場合はfalseを返します。これが私の現在のコードです:
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;
}
最初にこれを試したとき、私は[OK]ボタンが呼び出されたときにチェックし、それをサブスクライブして結果を返すことを確認するための単一のobservableです。これはうまくいきました、しかしそれは1つのボタンだけのためにうまくいきました、そして、キャンセルボタンをクリックするときはいつでも、これはすべてを壊しました。これは私が最初に持っていたものが一つのボタンだけのために完璧に働いたことです。
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;
}
canDeactivateモーダルを複数の観測可能物と連携させようとしたとき、私は何を間違っていますか?そして、どうすればよいですか?
回答:
回答№1は4CombineLatestは両方の観測量が値を発行するまで待機します。それはあなたの場合は起こりません。欲しい Observable.merge
代わりに。
return okResult.merge(cancelResult).take(1)
または
return Observable.merge(okResult, cancelResult).take(1)