1

我有一个应用程序，其组件结构如下：

1. Fam.Component
1.1. Header.Component <------ Unable access param from here
1.2. ParentGrid.Component
1.2.1. ChildGrid.Component
1.2.1.1 GrandChildGrid.Component <----- Can access from here!!

单击父网格中的项目，将加载与该项目相关的子网格。

在大子级别，我的浏览器 URL 如下所示：

http://onebigfamily.com/Fam/Parents/1/Children/23/GrandChildren

这将基本上显示第一个父母的第 23 个孩子的所有孙子。

我的路由配置中此 URL 的路径如下所示：

Fam/Parents/:parentId/Children/childId:/GrandChildren

我可以通过做一个简单的操作从我的组件中导航来访问childId和parentId参数值（当然对于父 ID 必须遍历路由树）。ActivatedRouteGrandChildrenthis.route.snapshot.params['childId']

现在问题...

如何从我的 Header 组件访问:childIdand ？:parentId当我执行这些值时，这些值显示为未定义this.route.snapshot.params['childId']？

我只需要访问父 ID 和子 ID，只要它们在 URL 中，无论哪个组件具有控件。

4

3 回答 3

1

您可以通过 访问子路由firstChild，因此（取决于您的路由配置），它可能如下所示：

this.route.snapshot.firstChild.firstChild.params['childId']

于 2018-10-09T06:48:51.100 回答
0

您可以在路由变量中获取 url 参数

this.route.params.subscribe(params => {
                var parentId = params['parentId'];
                var childId = params['childId'];
 });
于 2018-07-06T09:05:19.693 回答
-1

由于您要检查与 @ 您的标头创建时间不同的路由参数，因此您必须订阅路由更改并从更改事件中获取参数。在您的标头组件中，您必须执行以下操作：

  this.route.paramMap
    .subscribe(params => {
         //assign params here
    });

从文档中route注入的位置ActivatedRoute

params - 包含特定于路由的必需和可选参数的 Observable。请改用 paramMap。

它不适合您的原因是因为您的标头组件（父组件）与您的子组件具有不同的创建时间，因此路由快照就是这样 - 从创建标头的那一刻开始的路由快照。

于 2018-07-05T21:23:56.307 回答