每 x 秒从 Observable 获取数据，使用开始和停止按钮答案

【问题标题】：Get data from Observable every x Seconds, with Start and Stop buttons每 x 秒从 Observable 获取数据，使用开始和停止按钮
【发布时间】：2019-08-11 20:04:54
【问题描述】：

我有一个 Observable 可以每 x 秒调用一次。

还有两个名为 Start 和 Stop 的按钮来控制 observable。

我想在用户按下 Stop 按钮时停止进程并取消订阅，并在按下 Start 后每 x 秒开始获取数据

到目前为止我有：

public subscription: Subscription;
public isLoading: boolean = false;
public isStopped: boolean = true;

// Start Getting Data
getData() {
    this.isStopped = false;
    this.isLoading = true;

    this.subscription = this.proxy.InternetUserRwaits(model).pipe(
        repeatWhen(completed => {
            return completed.pipe(
                tap(_ => this.isLoading = false),
                delay(this.interval * 1000),
                tap(_ => this.isLoading = this.isStopped ? false : true),
            );
        }),
    )
    .subscribe(
        result => {
            this.isLoading = false;
            // ... rest of code
        },
        error => console.error(error)
    );
}

// Stop Getting Data
stopGettingData() {
    this.subscription.unsubscribe();
    this.isStopped = true;
    this.isLoading = false;
}

但在第一次停止后它不起作用

【问题讨论】：

从哪里获取数据？你的数据来源是什么？如果它是一个 observable，它会在什么时候发射，发射多少次？
是的，它是一个可观察的，每次都会发出整个数据。我想每隔 x 秒调用一次 observable

标签： angular rxjs

【解决方案1】：

最简单的方法是从一个可观察的间隔开始，每次它发出时，订阅你的可观察服务来获取数据：

this.subscription = interval(5000).pipe(
  tap(() => this.isLoading = true)
  switchMap(() => myService.loadData())
  tap(() => this.isLoading = false)
  finalize(() => this.isLoading = false)
).subscribe(data => this.result = data);

【讨论】：

感谢它现在的工作。我只需要做一些测试来看看超时或错误会发生什么。在这种情况下，它会重复调用可观察的服务吗？
如果你不明白这段代码的作用，那么你真的非常需要。最好的方法是阅读正在使用的函数的文档。出错时，错误会传播。如果即使一次加载失败也需要继续重复，则需要对 myService.loadData() 返回的 observable 使用 catchError 运算符。
是的，我不擅长 rxjs。代码很简单，看起来运行良好。
我要做的唯一更改是 a) 删除订阅变量并在 ngOnDestroy 中发出 destroy$: Subject<boolean>()，允许您将 takeUntil(this.destroy$) 添加到管道中，然后 b ) 将subscribe 回调中的逻辑移动到tap。

【解决方案2】：

我们需要更多信息..

您是否要阻止每个订阅者的流量？还是停止流向 Observable 的所有订阅者？

这是我为后者实现的步骤。

使用BehaviourSubject 和计时器创建一个Angular Service
功能。
在每个定时器间隔，调用
BehaviourSubject的.next()函数，传递你要传递的数据。
在服务中添加两个函数Start()和Stop()，并在定时器函数中使用if语句来控制对.next()函数的调用。
在您的子组件中，导入您的服务并订阅BehaviourSubject。
调用服务上的Start()和Stop()函数来控制数据的分布。

【讨论】：