无法从 ActivatedRoute 获取查询参数

Question

我在路由模块中有这样定义的路由：

{ path: 'warning/:type', component: WarningPageComponent }

当应用想要导航到警告页面时，会进行此调用：

const navigationExtras: NavigationExtras = {
        queryParamsHandling: 'preserve',
        queryParams: { errorCode: '12345'}
      };
return this.router.navigate(['/warning/default'],navigationExtras);

在WarningPageComponent 中，参数读取如下ngOnInit()：

const params = this.route.snapshot.paramMap;
console.log('ERR warning page' + JSON.stringify(params));
const errorCode = params.get('errorCode') ?? undefined;
const type = params.get('type') ?? undefined;

现在的问题是paramMap 中只有type 而errorCode 中没有。这里有什么问题？我也试过queryParamsHandling: 'preserve'

Angular 8.2.14

我没有找到解决方案：

• Angular erasing all query parameters
• Parent components gets empty Params from ActivatedRoute
• How to get parameters from the Angular ActivatedRoute

Answer 1

如果您想访问 queryParams，那么您必须在快照对象上使用 queryParamMap。

const queryParams = this.route.snapshot.queryParamMap;
const errorCode = queryParams.get('errorCode') ?? undefined;

Answer 2

像这样在构造函数中获取参数

import { ActivatedRoute } from '@angular/router';
    export class DashboardComponent implements OnInit, AfterViewChecked, OnDestroy {
    queryParams: any;
    constructor(private activatedRoute: ActivatedRoute) {
        this.queryParams = Utils.paramsToLower(this.activatedRoute.snapshot.queryParams);
      }
    }