Angular10 路由取参两种方式

沉默是金~

于 2021-11-04 10:50:03 发布

阅读量630

点赞数

分类专栏： Angular10 文章标签： angular.js 前端 angular

本文链接：https://blog.youkuaiyun.com/wyhc2021/article/details/121137717

版权

Angular10 专栏收录该内容

36 篇文章 ¥19.90 ¥99.00

订阅专栏

超级会员免费看

本文介绍了在Angular10中获取路由参数的两种方法：一是直接获取参数值，二是通过函数方式。详细阐述了这两种方式的实现步骤和应用场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、单纯取参数值

demo.html

      <a routerLink="/notice/notice" [queryParams]="{noticeType: selectedIndex===0?'1':'2'}"   target="_blank">更多<i nz-icon nzType="double-right" nzTheme="outline"></i></a>


demo.ts

private routeInfo:ActivatedRoute

this.noticeType = this.routeInfo.snapshot.queryParams['noticeType']

2、函数方式

this.activatedRoute.queryParams
    .pipe(
      debounceTime(300),
      distinctUntilChanged(),
    ).subscribe(param => {
      console.log(param);
      this.getProjectInfor(param);
 
        this.selectedIndex = Number(param.indexnumber)
      setTimeout(()=>{
        this.refreshData(this.selectedIndex === 1?0:null)
      },300)

    });