角 |导航时将参数传递给多个组件答案

【问题标题】：Angular | Pass parameter to multiple components when navigate角 |导航时将参数传递给多个组件
【发布时间】：2019-08-26 08:25:06
【问题描述】：

我的应用程序中有这个结构：

<div class="container">
    <top-navbar></top-navbar>
    <router-outlet></router-outlet>
    <navbar></navbar>
</div>

所以，我有 TopNavbarComponent、router-outlet 和 NavbarComponent。

然后我创建 HomeComponent 和 AboutComponent。

假设我想像这样从主页导航到关于：

路径定义：

{ path: 'about/:parameter', component: AboutComponent },

在 HomeComponent 我做：

this.route.navigate(['/about', 'a parameter'])

我的问题是：如何将参数传递给 TopNavbarComponent？ 所以我可以这样得到它：

this.activated_route.snapshot.params['parameter']

来自 TopNavbarComponent

有什么办法或者我应该采用另一种方法吗？

解决方案可以满足我的需求，但如果有人像我一样有答案建议欢迎

【问题讨论】：

【解决方案1】：

使用查询参数

this.router.navigate(['/about'], { queryParams: { page: pageNum } });
//will give host-address/about?page=2

或者

this.router.navigate(['/about', { id: aboutId, foo: 'foo' }]);
 // will give host-address/about;id=15;foo=foo

【讨论】：