0

我的应用程序中有登录/创建帐户。如果用户已经登录，我希望用户将无法看到登录/创建帐户。我正在使用 Authguard 来保护路由：

@Injectable()
export class AuthGuard implements CanActivate {

    constructor(private router: Router) { }

    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {debugger;
        if (localStorage.getItem('UserLoggedIn')) {
            // logged in so return true
            this.router.navigate(['']);
            return true;
        }

        // not logged in so redirect to login page with the return url
         this.router.navigate(['login']);
         return false;
    }

在这种情况下，页面将进入无限循环。

这是我的路线：

const appRoutes: Routes = [
  { path: '', component: HomeComponent , data: { animation: '' }},
  { path: 'login', component: UserloginComponent , data: { animation: 'login' },canActivate:[AuthGuard]},
  { path: 'create-account', component: CreateAccountComponent, data: { animation: 'create-account' } },
  { path: 'forgot-password', component: ForgotPasswordComponent, data: { animation: 'forgot-password' } },
  { path: '**', component: PageNotfoundComponent }
];

请帮忙。我想要它用于登录和创建帐户。

4

2 回答 2

1

这是因为您添加this.router.navigate(['login']);到您的 authguard 并且此 authguard 已附加到 login路由。每次访问路线时，它总是调用所有附加的警卫。因此，在您的情况下，如果您访问登录名，它将无限重定向到登录名。有很多方法可以解决您的问题。如果您打算在登录路由上添加保护，只需删除this.router.navigate(['login']);以避免无限循环。但我建议仅在用户未登录的情况下将保护添加到您想要保护被访问的那些路由。

于 2018-02-13T13:52:07.810 回答
0

尝试这个： 

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {debugger;

        let redirect: boolean = false;

        if (localStorage.getItem('UserLoggedIn')) {
            // logged in so return true
            this.router.navigate(['']);
            redirect = true;
        } else {
            // not logged in so redirect to login page with the return url
            this.router.navigate(['login']);
            redirect =  false;
        }


        return redirect;

    }
于 2018-02-13T13:37:07.360 回答