javascript - 离子角度重定向到错误的路线

Question

我有使用选项卡样式的 ionic 应用程序，然后我将选项卡 URL 置于身份验证之下，此后用户登录并打开应用程序重定向后无法正常工作。

问题

1. 由于我将标签置于身份验证保护之下，因此我的默认 URLtabs/groups变为tabs/tabs/groups
2. 当用户is logged in重新打开应用程序时，他们将重定向到localhost/tabs而不是localhost/tabs/tabs/groups

注意：如果我的第一个问题得到解决（删除额外的标签），那么当前重定向将按预期工作，因为tabs默认路径是tabs/groups

代码

AuthGuard

export class AuthGuardGuard implements CanActivate {
  constructor(
    private router: Router,
    public auth: AuthService
  ) { }

  canActivate(
    next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
    const currentUser = this.auth.isLoggedIn;
    if (currentUser) {
      return true;
    }
    this.router.navigate(['/login']);
    return false;
  }
}

app-routing.module.ts

import { NgModule } from '@angular/core';
import { PreloadAllModules, RouterModule, Routes } from '@angular/router';
import { AuthGuardGuard } from '../app/Guards/auth-guard.guard';

const routes: Routes = [
  {
    path: '',
    redirectTo: 'tabs',
    pathMatch: 'full'
  },
  {
    path: 'login',
    loadChildren: () => import('./Pages/Auth/login/login.module').then( m => m.LoginPageModule)
  },
  {
    path: 'register',
    loadChildren: () => import('./Pages/Auth/register/register.module').then( m => m.RegisterPageModule)
  },
  {
    path: 'intro',
    loadChildren: () => import('./Pages/intro/intro.module').then( m => m.IntroPageModule)
  },
  {
    path: 'tabs',
    canActivate: [AuthGuardGuard],
    loadChildren: () => import('./tabs/tabs.module').then( m => m.TabsPageModule)
  }
];

tabs-routing.module.ts

const routes: Routes = [
  {
    path: 'tabs',
    component: TabsPage,
    children: [
      {
        path: 'groups',
        loadChildren: () => import('../tab1/tab1.module').then(m => m.Tab1PageModule)
      },
      {
        path: 'phones',
        loadChildren: () => import('../tab2/tab2.module').then(m => m.Tab2PageModule)
      },
      {
        path: 'tab3',
        loadChildren: () => import('../tab3/tab3.module').then(m => m.Tab3PageModule)
      },
      {
        path: 'profile',
        loadChildren: () => import('../Pages/Auth/profile/profile.module').then( m => m.ProfilePageModule)
      },
      {
        path: '',
        redirectTo: 'groups',
        pathMatch: 'full'
      }
    ]
  },
  {
    path: '',
    redirectTo: 'groups',
    pathMatch: 'full'
  }
];

知道问题出在哪里吗？

标签： javascriptangularionic-framework