Question

我有一个可观察，每 x 秒拨打一次。

和两个名为开始和停止的按钮来控制可观察对象。

我想在用户按下停止按钮时停止该过程并取消订阅，并在按下开始 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;
}

但在第一站后无法正常工作

Answer 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);

Answer 2

我们将需要更多信息。

您是否要停止每个订户的流量？还是停止流向可观察对象的所有订阅者？

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

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

每隔x秒从“ Observable”获取数据，使用“开始”和“停止”按钮

2 个答案: