路由传值
来源:互联网 发布:mac南瓜色口红是几号 编辑:程序博客网 时间:2024/06/06 19:09
路由传递参数
写法
<a [routerLink]="['/']" [queryParams]="{id:1}">主页</a><!-- 使用查询 参数 [queryParams]={} 传递数据-->
url
http://127.0.0.1:4200/?id=1
取值
this.activatedRoute.snapshot.queryParams['id']
路由路径中传递参数
{path: 'product/:id', component: ProductComponent}, /** * 修改路由 使其可以携带参数 */
<a [routerLink]="['/product',1]">商品详情</a>this.route.navigate(['/product', 2]);link 值的数组中 填充要传递的值
url
http://127.0.0.1:4200/product/1
取值
this.activatedRoute.snapshot.params['id']; ```## 参数订阅 使用镜像时只创建一次 但是使用订阅的时候是创建一个订阅对象,当观察对象状态发生改变的时候订阅者接受改变的值
this.activatedRoute.params.subscribe((p: Params) => console.log(p[‘id’]));
> 路由配置中传递数据
使用data 参数定义静态的对象 配置静态数据
获取数据 this.activatedRoute.data.forEach(x => console.log(x));
可能存在与 在路由路径中传递参数冲突
“`
阅读全文
0 0
- 路由传值介绍
- 路由传值
- 路由传值
- AngularJs路由单向传值
- 16、vue.js 之路由传值
- vue 路由传值 query 和 params
- AngularJS 路由及传值功能
- iOS路由设计(一) 路由响应链方法进行传值
- vue动态路由匹配,路由传参
- angularjs路由传参
- angular路由传参
- AngularJS路由传参
- vue路由传参
- metric--路由度量值
- 路由
- 路由
- 路由
- 路由
- IOC容器中bean的生命周期
- WeaveSocket框架-Unity太空大战游戏-客户端-3
- bpmn业务流图注意事项,常见报错问题
- 大数据日知录:架构与算法.pdf 免费下载
- 欢迎使用CSDN-markdown编辑器
- 路由传值
- unity日常——EventTrigger
- golang基础-WaitGroup、kafka消费者
- 链表的倒置
- Spring MVC pom.xml
- 动态SQL.绑定变量.静态SQL的性能对比
- Git服务器搭建
- 文章标题 第十二周学习报告
- Angular4 变更检测和Docheck钩子