Question

我已经在我的app.component.ts页面上实现了ActivatedRoute。这是我上面有一个大的红色退出按钮的页面，它按预期显示在我的应用程序的所有页面上。

我跳入创建的URL（带有查询字符串），如下所示：

http://localhost:4200/status?returnString=xyz

我的构造函数中有一个private route: ActivatedRoute。在我的ngOnInit()函数中，我有console.log(this.route.queryParams);。然后返回一个对象，其中._value是具有预期属性returnString: "xyz"的对象。

问题是，当我console.log(this.route.queryParams.returnString)或console.log(this.route.queryParams._value)被提供给没有属性的对象时。 {}。

我的问题是，发生了什么或此外，我在做什么错？从Angular 5中可以使用的URL中获取参数将需要什么？

Answer 1

您遇到的问题是由于queryParams是Observable。

在您的ngOnInit()函数中，您需要订阅可观察的内容：

ngOnInit() {
    this.route. queryParams.subscribe(
      params => {//Do something with the params.returnString},
      err => console.log(err)
);
}

Official Angular Docs - ActivatedRoute

Answer 2

queryParams是可观察的，因此您应该听更改而不是检查值。

启动app.component时，尚未设置该值，但在检查时已设置。这可能就是您所遇到的。

设置侦听器，然后对更改做出反应

route.queryParams.subscribe((params: Params) => this.doSomething(params.returnString))

Angular 5中的ActivatedRoute没有传递URL参数。有想法吗？

2 个答案: