【问题标题】:How to manage Angular resolvers in an ngrx environment如何在 ngrx 环境中管理 Angular 解析器
【发布时间】:2018-08-09 23:25:28
【问题描述】:

路线是/sim/:id

我正在使用 Angular 解析器向 GET /api/sim/{id} 发出 HTTP 请求,以获取在布局组件中使用的单个数据(页面标题)。响应是一个大的 JSON 对象,但我只想要一个数据。

然后在与此路由关联的主要组件中,我调度一个 ngrx 动作,该动作触发一个效果,该效果执行相同的请求 GET /api/sim/{id} 并使用响应填充存储。

然后我使用 ngrx 选择器从存储中检索数据并填充视图(仅供参考,视图使用大量响应数据)。

这工作正常,但我向同一个端点发出 2 个 HTTP 请求。我怎样才能最好地避免这种情况?我不需要代码,只是一些方向。谢谢。

我正在使用最新版本的 Angular 和 ngrx。

【问题讨论】:

  • 你可以设置某种缓存,或者使用 Observable 操作符 throttleTime : learnrxjs.io/operators/filtering/throttletime.html
  • 如果我理解正确:您需要 AppComponent 的数据来更改标题,而某些子组件需要使用其余数据来填充?我是对的?
  • 是的,没错:)

标签: angular ngrx


【解决方案1】:

TL;DR:使用解析器中的数据。

嗯,就是这样。

而不是调度一个动作来触发一个效果来获取数据并触发一个新的动作来填充存储......让解析器使用数据触发最后一个动作来填充存储。

查看this article 了解更多想法。


更新:

这是另一个想法:在您的提供商中将全部信息存储在您的路由器数据中。

假设您使用解析器仅存储 title 属性(因为这就是您在父组件中所需要的全部)并通过 this.router.snapshot.data 访问 ir:如果您存储整个数据,您还可以获得使用以下方法从子组件中获取它:

this.router.parent.snapshot.data

【讨论】:

  • 哇,这是一个很棒的主意 :) 会阅读这篇文章 - 如果没有更好的答案,我会接受
  • 看看那些......我不认为你得到比那些更好的答案;)你已经在解析器中拥有数据。从那里使用它。或者使用服务,但是解析器给用户更好的“页面加载”感觉。
猜你喜欢
  • 1970-01-01
  • 2017-12-15
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-02-05
  • 2018-09-21
  • 2020-04-03
  • 1970-01-01
相关资源
最近更新 更多