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;
}