路由的说明
· 路由是实现spa的基础设施
· 作用:让用户从一个视图导航到另一个视图
· 路由是:url和组件的对应规则
· 使用:html5风格(history.pushState)的导航
· 支持:重定向、路由高亮、通配符路由、路由参数
· 支持:子路由、路由模块、路由守卫、异步路由等
路由的配置:
·再index.html中 <base href=“/”>
·倒入RouterModule模块
·配置路由规则
·将RouterModule.forRoot(appRoutes)模块配置在根模块中
·使用<router-outlet></router-outlet>指定路由出口
最简单的路由配置
forRoot的说明
· 问题说明:服务应该是单例的,某些场景下会造成服务多次主持,破坏服务的单例特性
· 比如:路由懒加载的情况
· 解决方式:使用模块的forRoot()方法导入模块
· RouterModule的forRoot()保证项目中只有一个Router服务
默认路由
路由跳转
通配符路由
·如果匹配不到已经配置的路由则会跳转到通配路由
path:”**”
Component:’404组件’
一定要放在最下边
编程式导航
· 404页面倒计时返回首页
路由参数
子路由
children
路由激活高亮
routerLinkActive指令