问角5的认证

EN

{
path: 'admin',
component: AdminLoginComponent,
data: {title: 'Admin'},
children: [
  {
    path: 'overview',
    component: AdminOverviewComponent,
    canActivate: [AuthGuard],
    data: {title: 'Overview'}
  }
]
}

export class AdminLoginComponent{

constructor(private router: Router, private service: AuthService){}


loginUser(e) {
e.preventDefault();
let username = e.target.elements[0].value;
let password = e.target.elements[1].value;

if(username == 'test' && password == 'test'){
  this.service.login();
  this.router.navigate(['admin/overview']);
}
}

}

@Injectable()
export class AuthService {
isLoggedIn = false;

 // store the URL so we can redirect after logging in
 redirectUrl: string;

 login(): Observable<boolean> {
 return Observable.of(true).delay(1000).do(val => this.isLoggedIn = true);
 }

 logout(): void {
  this.isLoggedIn = false;
 }
}

@Injectable()
export class AuthGuard implements CanActivate, CanActivateChild {
  constructor(private authService: AuthService, private router: Router) {}

  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): 
boolean {
    let url: string = state.url;

    return this.checkLogin(url);
  }

  canActivateChild(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
    return this.canActivate(route, state);
  }

  checkLogin(url: string): boolean {
    if (this.authService.isLoggedIn) { return true; }

    // Store the attempted URL for redirecting
    this.authService.redirectUrl = url;

    // Navigate to the login page with extras
    this.router.navigate(['/admin']);
    return false;
  }
}