Angular 6 路由器無法導航

Question

我有一個組件（解鎖），它的 router.navigate 以某種方式不起作用。 我無法弄清楚為什么路由器不重定向頁面。 它只發生在這個組件中。 有任何想法嗎 ？

submit() {

    if (!this.unlockForm.valid) { return; }
    this.isLoading = true;
    this.userDataService.unlockCpo(this.model).subscribe(data => {
      this.oauthService.refreshToken().then(done => {
        this.translateService.get('UnlockAccount.UnlockSuccess').subscribe((res: string) => {
          this.toastr.success(res);
          this.isLoading = false;
         this.router.navigate(['/dashboard']); // there is not working but debuger goes on the line and no errors thrown..
        });
      }

還有我的 app.routing.ts

{
        path: 'unlock',
        component: UnlockComponent
    },
    {
        path: 'logout',
        component: LogoutComponent
    },
    {
        path: 'dashboard',
        canActivate: [CloudConnectivityGuard, AccessGuard],
        component: DashboardComponent
    },

這里的 canActive 方法

 canActivate(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot) {

    // const hasIdToken = this.oauthService.hasValidIdToken();
    const hasIdToken = true;
    const hasAccessToken = this.oauthService.hasValidAccessToken();

    if (!hasIdToken || !hasAccessToken) {
      this.router.navigate(['/login']);
      return false;
    }
    if (!this.userService.isCpo()) {
      this.router.navigate(['/unlock']);
    }

    return true;
  }
}

Answer 1

您還必須在警衛中創建路由器的對象。

此外，如果您返回true ，它將導航到該頁面。

constructor(protected router: Router) { }

canActivate() {
    const hasIdToken = true;
    const hasAccessToken = this.oauthService.hasValidAccessToken();

    if (!hasIdToken || !hasAccessToken) {
        this.router.navigate(['/login']);
        return false;
    }

    if (!this.userService.isCpo()) {
        this.router.navigate(['/unlock']);
        return false;
    }

    return true;
}