角2ルータ - ガードをアクティブにする

Question

セッションが無効な場合に、ユーザをログインページにリダイレクトするためのCanActivateガードを実装しています。

セッションが有効かどうかのチェックはサービスを通じて行われ、ガードからはサービスの呼び出しに加入してセッションの有効性の状態を取得します。

私はコードをデバッグしましたが、実際にはセッションが無効な場合は、ログインページにリダイレクトされます。しかし、ガードからtrueを返すと、ページはロードされません。

私のコードは、Angular documentation（Code on Plunker）に記載されているコードに似ています。

ガード自体に問題があるかどうかはわかりません。私が見ることのできる違いは、ガードがサービス内のプロパティにアクセスしていることです。しかし、それは重要ではないと私は考えています。私が理解できるものから、ガードからtrueを返すことは、単に通常のルーティング操作を続けるだけです。

注：私は角RC3を使用してい

コード：

ガード

export class MyGuard implements CanActivate { 
    constructor(private checkSessionService: CheckSessionService, private router: Router) {} 

    canActivate(
    next: ActivatedRouteSnapshot, 
    state: RouterStateSnapshot 
    ) { 
     this.checkSessionService.checkUserSession(localStorage.getItem('userToken')) 
     .subscribe(validSessionReturn => { 

      if (validSessionReturn) { 
       return true; 
      } else { 
       // redirect to login 
       this.router.navigateByUrl('/login'); 
       return false; 
      } 
     }, 
     error => console.log(error)); 
    } 
} 

編集

私はinveました私が持っている問題は、subscribeメソッド自体からbooleanを返そうとしているという事実に関連しているように見えます。テストとして、私は次のことを試してみた、すべてが期待通りに働いていた：

export class MyGuard implements CanActivate { 
    constructor(private checkSessionService: CheckSessionService, private router: Router) {} 

    canActivate(
    next: ActivatedRouteSnapshot, 
    state: RouterStateSnapshot 
    ) { 
     if(localStorage.getItem('userToken') !== null) { 
      return true; // or return Observable.of(true); 
     } else { 
      return false; // or return Observable.of(false); 
     } 
    } 
} 

あなたは1のどちらかbooleanまたはObservable<boolean>を返すことができます上記のコードから気づくことができます。私が実装したCheckSessionServiceはObservable<boolean>を返します。予想通り、私は以下のコードを試してみました実際には、もう一度、すべてがそうでない場合は、ルーティングが停止され、セッションが有効であれば、ページが正常にロードされていることを意味し、働いていた：

export class MyGuard implements CanActivate { 
    constructor(private checkSessionService: CheckSessionService, private router: Router) {} 

    canActivate(
    next: ActivatedRouteSnapshot, 
    state: RouterStateSnapshot 
    ) { 
     return this.checkSessionService.checkUserSession(localStorage.getItem('userToken')); 
    } 
} 

は、しかし、上記の例を私はできませんサービスによって取得された値に基づいて特定のページにリダイレクトする方法を見つけます。私の質問は、this.checkSessionService.checkUserSession(localStorage.getItem('userToken'))の結果をsubscribeメソッドなしで確認する方法があるかどうか、またはsubscribeメソッドから戻る方法が異なります。私は試しました：

if(this.checkSessionService.checkUserSession(localStorage.getItem('userToken')) === Observable.of(false)) 

期待どおりに動作しませんでした。

Answer 1

this.checkSessionService... 

代わりに観測可能に加入するの

return this.checkSessionService... 

で元に戻して、subscrptionを返し、あなたも自分自身、観察を返す必要がありますが、それは偽のケースで何かをプラグイン：

return this.checkSessionService.checkUserSession(localStorage.getItem('userToken')) 
    .do(‌​function(authenticated) { 
     if (!authenticated) ... 
    });