原创力文档- 1、本文档共28页，可阅读全部内容。
- 2、原创力文档（book118）网站文档一经付费（服务费），不意味着购买了该文档的版权，仅供个人/单位学习、研究之用，不得用于商业用途，未经授权，严禁复制、发行、汇编、翻译或者网络传播等，侵权必究。
- 3、本站所有内容均由合作方或网友上传，本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺！文档内容仅供研究参考，付费前请自行鉴别。如您付费，意味着您自己接受本站规则且自行承担风险，本站不退款、不进行额外附加服务；查看《如何避免下载的几个坑》。如果您已付费下载过本站文档，您可以点击 这里二次下载。
- 4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等，请点击“版权申诉”（推荐），也可以打举报电话：400-050-0827(电话支持时间：9:00-18:30)。
项目六
--智慧工厂气报表模块;;;;情景导入;基本框架;;;;;在app.module.ts文件中，从@angular/router库中入?RouterModule;（1）使用RouterModule.forRoot()来为应用程序提供使用路由必需的依赖RouterModule?对象提供了两个静态的方法forRoot()?、?forChild()?
（2）配置路由需要用到Routers数组，数组的每一个元素即为一个路由配置项
path（path不能用斜线开头）属性定义路由的匹配路径
component?属性定义路由匹配时需要加载的组件;RouterOutlet指令是用来标记路由显示视图的位置，指定在页面的哪一位置渲染路由的内容。
router-outlet/router-outlet
//此处呈现component;使用routerLink指令。当在标签上绑定routerLink指令，用户通过点击标签，来进行导航
ul
lia[routerLink]=[home]Home/a/li
lia[routerLink]=[about]About/a/li
/ul
;;（1）在HTML模板中添加属性[queryParams]，使其携带参数
（2）在ts文件中，创建变量来接收传递过来的参数，使用ActivatedRoute服务保存当前路由的信息，并使用参数快照（snapshot属性）接收路由传递过来的参数;（1）在app-routing.module.ts中修改path属性值使其携带参数
（2）在HTML模板添加传递参数
（3）使用参数快照（snapshot属性）获取参数值;主要作用是当访问一个特定地址时，将其重定向到另一个指定的地址。
重定向路由的配置如下：
{path:要定向的路径,redirectTo:要定向到的目标路由，pathMatch:匹配方式};子路由是嵌套在主路由里，由children表明这是子路由且可以无限循环嵌套。;（1）在主路由的插座定义一个辅助路由插座。
添加一个name属性用来指定辅助路由显示的组件
（2）配置入口参数。
添加outlets属性，该对象里面传入上述的name属性值
（3）配置辅助路由路径。
添加outlet属性，指定该路由显示在对应名称的路由插座上;允许从一个页面跳转到另一个页面时执行一些指定的逻辑，并根据执行的结果来决定是否跳转。;;;;;;;
文档评论（0）