Question

我的表单需要访问路由参数和数据。它们是可观察的，所以我需要订阅才能访问它们的值。我的问题是，如何在一个订阅中同时访问它们？

this._route.params.subscribe(
  params => {
    getData(params['id'], data['id2'] <=== i need data value too. how do i get this???)
  });

为什么棱角分裂将它们放在两个独立的可观测量中？

Answer 1

如何在一次订阅中同时访问它们？

您可以使用ActivatedRoute中的ActivatedRouteSnapshot。 ActivatedRouteSnapshot接口具有params和queryParams属性，您可以同时获取这两个值。

请勿尝试直接注射ActivatedRouteSnapshot。它不会起作用。您必须注入ActivatedRoute并访问其snapshot属性。

注意：我们只使用这种技术获得参数的初始值

constructor(private _route: ActivatedRoute) {
    console.log(this._route.snapshot.params);
    console.log(this._route.snapshot.data);
}

示例Plunker

另一种方式，由于params和data为observable，我们可以使用zip运算符合并它们，然后在单个订阅中访问它们。但请注意，如果params或data中的某个没有值，则不会触发订阅。

this._route.params
  .zip(this._route.data)
  .subscribe((value) => {
    this.id = value[0]["id"]; // get param
    this.data = value[1]; // get data value
  });

示例Plunker

为什么棱角分裂将它们放在两个独立的可观测量中？

我已阅读文档，你是对的，有单独的可观察对象，但我不知道为什么。

Answer 2

与迈克尔的回复类似，您可以使用ActivatedRouteSnapshot中的ActivatedRoute获取路线data。

您可以将其置于params订阅中，即使该路由不包含任何params，也会触发该订阅。

this.route.params.subscribe((params) => {
  console.log(params);
  console.log(this.route.snapshot.data);
});

订阅Angular 2中的路径参数和数据

2 个答案: