时间戳

首页 > 解决方案 > 无论我做什么，我的激活路由查询参数总是空的

angular - 无论我做什么，我的激活路由查询参数总是空的

问题描述

我不确定这里可能会出现什么问题。我有一个带有查询参数的 URL

?search=something

在我的一个组件中，我尝试提取它

const input = this.activatedRoute.queryParams.search;

这是公共演示网址：https ://angular-ivy-pjfam6.stackblitz.io/?search=something

代码：Stackblitz

似乎有效，在日志中我实际上是路由跟踪日志中的 queryParam，但在我尝试提取它时，它已经消失了。有什么建议么？

更新：似乎如果我不去快照

this.activatedRoute.queryParams.subscribe(qp => {
   const input = qp?.search;
   this.element.nativeElement.value = input;
});

堆栈闪电战

标签： angularangular-routing

解决方案

有两种访问参数的方法：

1 -route.snapshot.paramMap

2 -route.paramMap.subscribe

如果您不想在访问它的同一组件中更新您的参数，您可以使用snapshot.

snapshot是同步的，并且在使用时snapshot，一旦组件加载，您就会获得该值：

ngOnInit() {
  this.input = this.route.snapshot.paramMap.get("search")
}

但是如果你想在同一个组件中更新参数，那么你必须使用订阅你应该订阅它来获取值：

ngOnInit() {
  this.route.paramMap.subscribe(params: ParamMap => {
             this.input= +params.get('search');
             console.log(params);     
          });
}

每次更新值时订阅时，您都可以获得它。

推荐阅读