Question

我想知道是否可以像在example中那样在动态创建的组件上使用async RxJS的{{1}}管道。因为如果我在其中应用interval()管道，那么当组件更改时，间隔将被忽略。

假设我想每15分钟获取一次数据，但组件每15秒更改一次。

我发现的唯一方法是从一个async中获取数据并将其保存到另一个Observable中，但是我认为这不是最佳实践。还有其他方法可以实现这一目标吗，还是可以的呢？

Observable如下所示：

interval(1000 * 60 * 15).pipe(startWith(0), switchMap(() => this.http.get('someUrl')));

我找到了可行的解决方案：

interval(1000 * 60 * 15).pipe(startWith(0), switchMap(() => this.http.get('someUrl'))).subscribe((data) => {
  this.someUrlData = scheduled([data], asapScheduler);
});

Answer 1

您所拥有的解决方案似乎可以正常运行，并且是可以接受的解决方案。但是，如果我是一位新开发人员来寻找它，我可能会对此感到困惑，并可能尝试进行不明智的重构（除非您对此发表了强烈评论）。

出于这个原因，我会尝试一种更具可读性的方法（如果我误解了您的用例，请原谅我）：

getData = new Subject<void>();

// UI Observable (referenced via the async pipe)
someData$ = this.getData.pipe(
    switchMap(() => this.http.get('someUrl')),
    shareReplay(1)
)

// Subscriptions (inside ngOnInit)
timer(0, 1000 * 60 * 15).subscribe(() => this.getData.next())

这里的优点是您还可以控制何时获取数据。您可以轻松地在屏幕上添加一个“刷新”按钮，并将其放在getData主题的下一个位置。

请务必在计时器上清理您的订阅，否则它将永远消失。

更新：

要回答您的原始问题，从一个Observable取值并将其保存到另一个值是100％的最佳实践。但是，要避开被破坏的组件，最佳实践是将其放入服务中，以使其保持完整。

Answer 2

我认为您找到的答案是达到您想要做的最好的方法。您可以使用时间间隔创建一个共享状态，并在创建动态组件时检查时间间隔并基于它进行http调用，我认为在所有方面都需要一个可以听见的外部状态，因为您将破坏每次创建组件的时间间隔。

如何在动态创建的组件上以RxJS间隔使用异步管道？

2 个答案: