angular配置路由(二)

2018-09-19  本文已影响0人  小话001

一:在已存在的项目中配置路由:
1,新建TS文件,命名为app-routing。


空白TS文件

2,在当前目录下新建三个不同的组件,用于后面的路由跳转。例ng g c components/header。
3,在app-routingTS文件中分别导入路由模块和相应的 组件


引入模块
4,配置路由:
配置路由
5,配置模块,暴露模块
配置与暴露

6,app-html页面


08.png
7,新闻页面html,当前传的死数据,后面可以换成循环出的数据
步骤4设置好的路由,当前直接传
8,新闻详情页面TS页面接收id数据
接收id
9,点击效果
10.png 11.png

二:JS跳转路由:即跳转路由的操作是由事件引发后再进行的。
2.1在header组件的html 页面绑定事件,然后再TS页面 导入--声明--使用


页面绑定

2.2TS页面使用:


导入--声明
2.3定义事件
事件定义
上一篇 下一篇

猜你喜欢

热点阅读