架构师_程序员

 找回密码
 注册[Register]

QQ登录

只需一步,快速开始

查看: 169|回复: 0

[Angular] Angular 关于获取Matrix URL 和 普通URL 查询字符串问题

[复制链接]
跳转到指定楼层
楼主
发表于 2019-6-4 09:59:40
zu
Angular 文档上关于怎么来获取这两种URL规范的querystring并没有给出详细的解释。

ActivatedRoute文档:

interface ActivatedRoute {
  snapshot: ActivatedRouteSnapshot
  url: Observable<UrlSegment[]>
  params: Observable<Params>
  queryParams: Observable<Params>
  fragment: Observable<string>
  data: Observable<Data>
  outlet: string
  component: Type<any>|string|null
  get routeConfig(): Route|null
  get root(): ActivatedRoute
  get parent(): ActivatedRoute|null
  get firstChild(): ActivatedRoute|null
  get children(): ActivatedRoute[]
  get pathFromRoot(): ActivatedRoute[]
  get paramMap(): Observable<ParamMap>
  get queryParamMap(): Observable<ParamMap>
  toString(): string
}
获取这两种不同格式的url的方法就是上面的params,queryParams

二者都返回一个Observable可观察对象,泛型为一个Params

下面转到Params 文档说明:

  1. type Params = {
  2.   [key: string]: any
  3. };
复制代码
下面是拿出queryString的实践

Matrix URL

  1. let param =  this.route.params.map(params => params['key'])
复制代码

Default URL

  1. let param =  this.route.queryParams.map(params => params['key'])
复制代码

可以看到ActivatedRoute提供了url,params,queryParams等。ActivatedRoute这几个属性返回的是Observable,它是可以用来监控url,参数的变化。

注入使用如下:

  1. @Component({...})
  2. class MyComponent {
  3.   constructor(private route: ActivatedRoute) {
  4.     const id: Observable<string> = route.params.map(p => p.id);   //获取参数
  5.     const url: Observable<string> = route.url.map(segments => segments.join('')); //获取拼接的url
  6.     const user = route.data.map(d => d.user); //获取数据
  7.   }
  8. }
复制代码






上一篇:js将json格式的对象拼接成复杂的url参数方法
下一篇:前端Object.assign()用法
帖子永久地址: 

架构师_程序员 - 论坛版权1、本主题所有言论和图片纯属会员个人意见,与本论坛立场无关
2、本站所有主题由该帖子作者发表,该帖子作者与架构师_程序员享有帖子相关版权
3、其他单位或个人使用、转载或引用本文时必须同时征得该帖子作者和架构师_程序员的同意
4、帖子作者须承担一切因本文发表而直接或间接导致的民事或刑事法律责任
5、本帖部分内容转载自其它媒体,但并不代表本站赞同其观点和对其真实性负责
6、如本帖侵犯到任何版权问题,请立即告知本站,本站将及时予与删除并致以最深的歉意
7、架构师_程序员管理员和版主有权不事先通知发贴者而删除本文

码农网,只发表在实践过程中,遇到的技术难题,不误导他人。
您需要登录后才可以回帖 登录 | 注册[Register]

本版积分规则

免责声明:
码农网所发布的一切软件、编程资料或者文章仅限用于学习和研究目的;不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负。本站信息来自网络,版权争议与本站无关。您必须在下载后的24个小时之内,从您的电脑中彻底删除上述内容。如果您喜欢该程序,请支持正版软件,购买注册,得到更好的正版服务。

Mail To:help@itsvse.com

QQ|Archiver|手机版|小黑屋|架构师 ( 鲁ICP备14021824号-2 )|网站地图

GMT+8, 2019-7-17 14:19

Powered by Discuz! X3.4

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表