Question

如果用户没有登录，想要一些安全的根，例如＆＃34; / items＆＃34; authguard返回false并且不导航＆＃34; / login＆＃34;。

export const APP_ROUTES: Routes = [
  {path: '', component: PublicComponent, children: PUBLIC_ROUTES},
  {
    path: '',
    component: SecureComponent,
    resolve: {user: UserResolver},
    canActivate: [AuthGuard],
    children: SECURE_ROUTES
  },
  {path: '', redirectTo: '/login', pathMatch: 'full'}
];

AuthGuard代码：

@Injectable()
export class AuthGuard implements CanActivate {
  constructor(private userService: UserService) {}

  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot){
    let url: string = state.url;
    return this.checkLogin(url);
  }

  checkLogin(url: string): Observable<boolean> {
    this.userService.redirectUrl = url;
    return this.userService.getPrincipal()
      .map(user => {
        if(user)
          return true;

        return false;
      });
  }
}

Answer 1

注入Router，如果用户未按如下方式登录，则重定向到登录页面：

@Injectable()
export class AuthGuard implements CanActivate {

  constructor(private userService: UserService, private router: Router) {}

  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean{
    let url: string = state.url;
    return this.checkLogin(url);
  }

  checkLogin(url: string): Observable<boolean> {
    this.userService.redirectUrl = url;
    return this.userService.getPrincipal()
      .map(user => {
        if(user)
          return true;

        this.router.navigate(['login']);
        return false;
      });
  }
}

Angular2 Authguard登录路线

1 个答案: