Angular 9 - 在路由之间共享数据

Question

我想在路由之间共享数据，而不是在每个组件加载时从 API 获取数据。

回购：https://github.com/theADAMJR/2PG-Dashboard

当前当用户加载 /dashboard/:id/... 路由时，这被称为：

this.roles = await this.guildService.getRoles(this.guildId);

我只希望在用户加载任何仪表板路由时调用它一次：/dashboard/:id/...。

我将如何实现这一目标？

Answer 1

有多种方法可以做到这一点。在最简单的形式中，您只需将 data 附加到路由 state 对象：

this.router.navigate(['/some-route'], {state: {data: {...}}});

https://angular.io/guide/router

你也可以这样做：

• 解析器 (https://angular.io/api/router/Resolve)
• 实施适当的状态管理 (https://ngrx.io/)
• 创建一个单例服务作为您的全局应用内存储
• 使用 LocalStorage（不推荐，但可以使用）