在canDeactivate中处理两个可观察对象

Question

在我的canDeactivate（）路径守卫中，我调用了一个有两个按钮的模式：ok和cancel。如果点击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; 
    } 

最初测试了这一点的时候，我只有一个单一的观察到的，检查时确定按钮被调用，然后将订阅的，并返回结果。这工作，但它只适用于一个按钮，每当点击取消按钮，这打破了一切。这是我最初的工作，只有一个按钮完美。

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模式与多个observable一起工作时，我该做什么错误，我应该怎么做？

Answer 1

CombineLatest会一直等到两个观测值发出一个值。这从来没有发生你的情况。您需要改为Observable.merge。

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

或

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