import { AuthGuard } from './auth.guard';
import { RouterModule } from '@angular/router';
import { FormsModule } from '@angular/forms';
@NgModule({
declarations: [...],
imports: [
...
RouterModule.forRoot(routes),
FormsModule,
...
],
providers: [{provide: APP_BASE_HREF, useValue : '/' }, AuthGuard],
bootstrap: [...]
})
export class AppModule { }
import { Injectable } from '@angular/core';
import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, Router } from '@angular/router';
@Injectable()
export class AuthGuard implements CanActivate {
constructor(private router: Router) { }
canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
// Your authentication logic here
return true; // Or false if access denied
}
}
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { HomeComponent } from './home/home.component';
import { DashboardComponent } from './dashboard/dashboard.component';
import { AuthGuard } from './auth.guard';
const routes: Routes = [
{ path: '', component: HomeComponent },
{ path: 'dashboard', component: DashboardComponent, canActivate: [AuthGuard] }
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }
在这个例子中,AuthGuard将保护/dashboard路由,只有在canActivate方法返回true时才能访问。
canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
console.log('AuthGuard#canActivate called');
// Your authentication logic here