Angular2ルータはログアウト後にcanActivateする

Question

いくつかのルート（例えば '/ profile'）に対してlogin-guardを使用しました。

canActivate() { 
    if (this.user.islogin) return true; 
    this.router.navigate(['']); 
} 

ログインしていない場合は、メインページにリダイレクトされ、一部のルートへのアクセスが試行されます。それはうまく動作します。 ユーザーは任意のページからログアウトできます。私は、次の振る舞いをアプリケーションに持たせたい： ユーザーが '/ profile'ページにアクセスして 'logout'をクリックすると、canActivate（）メソッドによってメインページにリダイレクトされるはずです。しかしこの場合、このメソッドは呼び出されません。 canActivate（）（ページをリロードする、手動で呼び出す）を実行するにはどうすればよいですか？ 私のログアウト方法：

logout() { 
    localStorage.removeItem('auth_token'); 
    this.islogin = false; 
} 

は、私は方法をログアウトするthis.router.navigate([this.router.url]);を追加しようとしましたが、結果は同じです。 ページをリロードする場合のみ、angular2が私をリダイレクトします。 正しい方法は何ですか？

Answer 1

あなたのガードはちょうどisloginを使用していることを考慮すると、ユーザーがログアウトするときは、これをfalseに設定していることを、最も簡単な方法は、単純に、ログアウト時にリダイレクトすることです：あなたは、ロジックを再利用したい場合は

logout() { 
    localStorage.removeItem('auth_token'); 
    this.islogin = false; 
    this.router.navigate(['']); <---- ADD THIS 
} 

、

まず、あなたのlogout()はどこのサービスを注入：canActivate()で最初のルートを変更せずに、あなたはこのようにそれを行うことができ

constructor(
    private router: Router, 
    private route: ActivatedRoute, 
    private canActivateGuard: CanActivateGuard) {} 

次（ちょうどあなたが代わりにCanActivateGuardのに使用される名前を使用）、logout()でそれを呼び出す：これで

logout() { 
    this.canActivateGuard.canActivate(
     this.route.snapshot, 
     this.router.routerState.snapshot); 
}