Angular 角度2复位可观测定时器

我有一个服务，每30秒自动调用一个方法。我还有一个按钮，允许用户重置计时器，防止这个方法再被调用30秒。如果单击按钮，如何重置计时器，使此方法在30秒内不会被调用

组成部分

constructor(private service: Service) {
  this.service.initialize();
}

refreshTimer(): void {
  this.service.refreshTimer();
}

服务

initialize(): void {
    timer(0, 30000).subscribe(() => this.refresh());
}

refreshTimer(): void {
  // Need help here
}

如您所见，我的组件从其构造函数调用initialize（），该构造函数初始化计时器，使其每30秒运行一次这个.refresh（）。我的html将在组件中调用refreshTimer（），最终在服务中调用refreshTimer（）来启动计时器。我该怎么做

---

提前谢谢

您应该取消订阅，然后重新订阅可观察的计时器

t = timer(0, 30000);
sub: Subscription;

initialize(): void {
    this.sub = this.t.subscribe(() => this.refresh());
}

refreshTimer(): void {
    this.sub.unsubscribe();
    this.initialize();
}

或者你可以有一种方法

t = timer(0, 30000);
sub: Subscription;

initTimer(): void {
    this.sub && this.sub.unsubscribe();
    this.sub = this.t.subscribe(() => this.refresh());
}

---

您应该取消订阅，然后重新订阅可观察的计时器

t = timer(0, 30000);
sub: Subscription;

initialize(): void {
    this.sub = this.t.subscribe(() => this.refresh());
}

refreshTimer(): void {
    this.sub.unsubscribe();
    this.initialize();
}

或者你可以有一种方法

t = timer(0, 30000);
sub: Subscription;

initTimer(): void {
    this.sub && this.sub.unsubscribe();
    this.sub = this.t.subscribe(() => this.refresh());
}

---

我会使用

switchMap

取消订阅以前的

计时器

并订阅重新开始的新计时器

private reset$ = new Subject();

initialize(): void {
  this.reset$
    .pipe(
      startWith(void 0),
      switchMap(() => timer(0, 30000)),
    )
    .subscribe(() => this.refresh());
}

refreshTimer(): void {
  this.reset$.next(void 0);
}

---

startWith

操作符需要在订阅时触发创建第一个

timer

。

我会使用

switchMap

取消订阅以前的

定时器，然后订阅重新开始的新定时器

private reset$ = new Subject();

initialize(): void {
  this.reset$
    .pipe(
      startWith(void 0),
      switchMap(() => timer(0, 30000)),
    )
    .subscribe(() => this.refresh());
}

refreshTimer(): void {
  this.reset$.next(void 0);
}

startWith
操作符需要在订阅时触发创建第一个
计时器。
this.refresh（）
的作用是什么？它只是调用api来刷新数据表中的数据。我不认为这是超级相关的，所以我没有包括它。refresh（）的作用是什么？它只是发出一个api调用来刷新数据表中的数据。我不认为这是超级相关的，所以我没有包括它很酷，谢谢。我认为这很接近，但每次点击refreshTimer（）时它都会触发这个.refresh（）。我们如何设置此选项，使此.refresh（）仅在计时器用完时被调用？您可以使用不会进行初始发射的
interval（30000）
。或者，您可以将计数传递给subscribe，并且仅在计数大于0时调用refresh（）。这样，它将忽略初始发射。subscribe（（count）=>{if（count>0）{this.refresh（）；}很酷，谢谢。我认为这很接近，但每次点击refreshTimer（）时它都会触发这个.refresh（）。我们如何设置它，使这个.refresh（）只有在计时器用完时才会被调用？您可以使用
interval（30000）
不会进行初始发射或者，您可以将计数传递给subscribe，并在计数大于0时仅调用refresh（）。这样，它将忽略初始发射。subscribe（（count）=>{if（count>0）{this.refresh（）；}其中是
refresh（）
method implementation？
refresh（）
是您想要做的事情，当计时器被触发时，
this.sub=this.t.subscribe（（）=>console.log（'job done'）；
或者作为上述示例的方法
refresh（）：void{console.log（'job done'）}
刷新（）

method implementation？

refresh（）

是您希望在触发计时器时执行的操作，

this.sub=this.t.subscribe（（）=>console.log（'job done'）；

或作为上述示例的方法

refresh（）：void{console.log（'job done'）}