從CanActivate後臺使用store.dispatch

Question

在我的示例Angular 2應用程序中，我使用ngrx/store來實現redux設計模式。

我已經實現CanActivate後衛在我的應用程序，下面是相關的代碼

canActivate(route: ActivatedRouteSnapshot, router: RouterStateSnapshot): Observable<boolean> { 

    this.store.dispatch(canActivate()); 
    // HOW TO RETURN value ?? 
} 

及以下的相關行動

export function canActivate(): Action { 
$.blockUI(); 
return { 
    type: UserActionTypes.CAN_ACTIVATE, 
    payload:{} 
    } 
} 

export function canActivateSuccess(canActivateResponse: any): Action { 
$.unblockUI(); 
return { 
    type: UserActionTypes.CAN_ACTIVATE_SUCCESS, 
    payload: canActivateResponse.data 
    } 
} 

而且下面是相關的減速碼

.... 
case UserActionTypes.CAN_ACTIVATE_SUCCESS:   
     return Object.assign({}, action.payload); 
..... 

及以下是相關效果代碼

@Effect() canActivate$ = this.actions$ 
     .ofType(UserActionTypes.CAN_ACTIVATE) 
     .switchMap(
     (action) => this.userService.canActivate() 
      .map(response => canActivateSuccess) 
     ); 

我的問題是，canActivate後衛應該返回可觀察布爾的，但是否返回true或false，將僅限於canActivateSuccess功能/動作是已知的，在這種情況下，我應該如何返回從canActivate後衛的值。

Answer 1

你可以返回的組合，$actions.ofType(..)與take(1)：

canActivate(route: ActivatedRouteSnapshot, router: RouterStateSnapshot): Observable<boolean> { 
    this.store.dispatch(canActivate()); 
    return this.this.actions$ 
     .ofType(UserActionTypes.CAN_ACTIVATE_SUCCESS) 
     .map(payloadToBoolean...); 
} 

---

旅遊注意：對於這個解決方案，您必須確保，沒有其他CAN_ACTIVATE_SUCCESS肌動發射而this.userService.canActivate()在跑。否則這可能會意外觸發警衛。