Angular 路由

路由顺序

路由的顺序很重要，因为 Router 在匹配路由时使用“先到先得”策略，所以应该在不那么具体的路由前面放置更具体的路由。首先列出静态路径的路由，然后是一个与默认路由匹配的空路径路由。通配符路由是最后一个，因为它匹配每一个 URL，只有当其它路由都没有匹配时，Router 才会选择它。

获取路由信息 ( ActivatedRoute)

import { Router, ActivatedRoute, ParamMap } from '@angular/router';
....
constructor(
  private route: ActivatedRoute,
) {}


ngOnInit() {
  this.route.queryParams.subscribe(params => {
    this.name = params['name'];
  });
}

设置通配符路由 (path:’**’)

添加一个通配符路由来拦截所有无效的 URL，并优雅的处理它们。 通配符路由的 path 是两个星号（**），它会匹配任何 URL。 而当路由器匹配不上以前定义的那些路由时，它就会选择这个通配符路由，通配符路由是最后一个路由，因为它匹配所有的 URL。

path 为 ** 的最后一条路由是通配符路由。如果请求的 URL 与前面列出的路径不匹配，路由器会选择这个路由，并把该用户送到 PageNotFoundComponent。

const routes: Routes = [
  { path: 'first-component', component: FirstComponent },
  { path: 'second-component', component: SecondComponent },
  { path: '',   redirectTo: '/first-component', pathMatch: 'full' }, // redirect to `first-component`
  { path: '**', component: FirstComponent },
  { path: '**', component: PageNotFoundComponent },  // Wildcard route for a 404 page
];

pathMatch （full/prefix）

• ‘full’ 会导致 URL 中剩下的、未匹配的部分必须等于path( ‘’ )
• “prefix” 每一个 URL，无论有效与否，都会匹配上这个路由定义

惰性加载

你可以配置路由定义来实现惰性加载模块，这意味着 Angular 只会在需要时才加载这些模块，而不是在应用启动时就加载全部。 另外，你可以在后台预加载一些应用部件来改善用户体验。

防止未经授权的访问 (路由守卫)

使用路由守卫来防止用户未经授权就导航到应用的某些部分。Angular 中提供了以下路由守卫：

• CanActivate （检查路由的访问权限）
• CanActivateChild （检查子路由的访问权限）
• CanDeactivate （询问是否丢弃未保存的更改）
• Resolve （预先获取路由数据）
• CanLoad （在加载特性模块之前进行检查）

ng generate guard your-guard //创建守卫类

export class YourGuard implements CanActivate {
  canActivate(
    next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): boolean {
      // your  logic goes here
  }
}

路由配置，这里的 canActivate 会告诉路由器它要协调到这个特定路由的导航。

{
  path: '/your-path',
  component: YourComponent,
  canActivate: [YourGuard],
}

路由注册

RouterModule.forRoot() 方法是用于注册全应用级提供者的编码模式。