angular的路由

1、添加<base>元素：告诉路由器如何合成导航用的URL

<base hred="/"> // app文件夹是应用的跟目录

2、angular的路由是一个可选服务。在 @angular/router 包中，RouterModule.forRoot() 方法来配置路由器，它的返回值需要添加到imports数组中。

3、每个Route 都会有一个URL 的path 映射到一个组件。path不能以斜杠 / 开头。

4、两个特殊的路由：

{ path: '' , redirectTo: '/name', pathMatch: 'full' } // 路径的默认路径起点

{ path: '**', component: NameComponent } // ** 通配符

 

5、路由器使用 先匹配者优先的策略

 

6、路由出口：RouterOutlet

<router-outlet><router-Outlet> // 类似占位符的角色，匹配到的组件会替换他

7、路由的路径和参数可以通过一个 ActivateRouter 的路由服务来获取。

属性	说明
url	路由路径的 Observable 对象，是一个由路由路径中的各个部分组成的字符串数组。
data	一个 Observable，其中包含提供给路由的 data 对象。也包含由解析守卫（resolve guard）解析而来的值。
paramMap	一个 Observable，其中包含一个由当前路由的必要参数和可选参数组成的map对象。用这个 map 可以获取来自同名参数的单一值或多重值。
queryParamMap	一个 Observable，其中包含一个对所有路由都有效的查询参数组成的map对象。 用这个 map 可以获取来自查询参数的单一值或多重值。
fragment	一个适用于所有路由的 URL 的 fragment（片段）的 Observable。
outlet	要把该路由渲染到的 RouterOutlet 的名字。对于无名路由，它的路由名是 primary，而不是空串。
routeConfig	用于该路由的路由配置信息，其中包含原始路径。
parent	当该路由是一个子路由时，表示该路由的父级 ActivatedRoute。
firstChild	包含该路由的子路由列表中的第一个 ActivatedRoute。
children	包含当前路由下所有已激活的子路由。

8、路由事件：

路由器事件	说明
NavigationStart	本事件会在导航开始时触发。
RouteConfigLoadStart	本事件会在 Router 惰性加载 某个路由配置之前触发。
RouteConfigLoadEnd	本事件会在惰性加载了某个路由后触发。
RoutesRecognized	本事件会在路由器解析完 URL，并识别出了相应的路由时触发
GuardsCheckStart	本事件会在路由器开始 Guard 阶段之前触发。
ChildActivationStart	本事件会在路由器开始激活路由的子路由时触发。
ActivationStart	本事件会在路由器开始激活某个路由时触发。
GuardsCheckEnd	本事件会在路由器成功完成了 Guard 阶段时触发。
ResolveStart	本事件会在 Router 开始解析（Resolve）阶段时触发。
ResolveEnd	本事件会在路由器成功完成了路由的解析（Resolve）阶段时触发。
ChildActivationEnd	本事件会在路由器激活了路由的子路由时触发。
ActivationEnd	本事件会在路由器激活了某个路由时触发。
NavigationEnd	本事件会在导航成功结束之后触发。
NavigationCancel	本事件会在导航被取消之后触发。 这可能是因为在导航期间某个路由守卫返回了 false。
NavigationError	这个事件会在导航由于意料之外的错误而失败时触发。
Scroll	本事件代表一个滚动事件。

 

9、ActivatedRoute 是一个可以注入的路由器服务，使用可观察对象来获取关于路由路径和路由参数的信息。

10、路由器中的关键词：

路由器部件	含义
Router（路由器）	为激活的 URL 显示应用组件。管理从一个组件到另一个组件的导航
RouterModule	一个独立的 NgModule，用于提供所需的服务提供商，以及用来在应用视图之间进行导航的指令。
Routes（路由数组）	定义了一个路由数组，每一个都会把一个 URL 路径映射到一个组件。
Route（路由）	定义路由器该如何根据 URL 模式（pattern）来导航到组件。大多数路由都由路径和组件类构成。
RouterOutlet（路由出口）	该指令（<router-outlet>）用来标记出路由器该在哪里显示视图。
RouterLink（路由链接）	这个指令把可点击的 HTML 元素绑定到某个路由。点击带有 routerLink 指令（绑定到字符串或链接参数数组）的元素时就会触发一次导航。
RouterLinkActive（活动路由链接）	当 HTML 元素上或元素内的routerLink变为激活或非激活状态时，该指令为这个 HTML 元素添加或移除 CSS 类。
ActivatedRoute（激活的路由）	为每个路由组件提供提供的一个服务，它包含特定于路由的信息，比如路由参数、静态数据、解析数据、全局查询参数和全局碎片（fragment）。
RouterState（路由器状态）	路由器的当前状态包含了一棵由程序中激活的路由构成的树。它包含一些用于遍历路由树的快捷方法。
链接参数数组	这个数组会被路由器解释成一个路由操作指南。你可以把一个RouterLink绑定到该数组，或者把它作为参数传给Router.navigate方法。
路由组件	一个带有RouterOutlet的 Angular 组件，它根据路由器的导航来显示相应的视图。

转载于:https://www.cnblogs.com/jsersudo/p/11161645.html