Angular可以启动按钮无法停止间隔

Question

我使用的是Angular，并且有此代码：

App.component.ts

started: boolean = false;

…

startStop() {
    if (!this.started) {
      setInterval(()=> { this.test() }, 1000); // not started so start the interval   
      this.started = true;
    } else if (this.started) {
      this.started = false;  // Its started so stop it');
      clearInterval();
    }
  }


test() {
  // do stuff only via interval if started
}

，然后我有一个按钮将其打开和关闭

App.component.html，

<button (click)=“startStop()”>Start / Stop</button>

即使“启动”更改为false，则间隔开启，但没有接触事件。

如何解决此问题？

Answer 1

这不是clear Interval的工作方式。如果您有几个间隔怎么办？它会停止哪一个？

setInterval返回您应该将其传递给clear Interval的ID

startStop() {
    let intervalId
    if (!this.started) {
      intervalId = setInterval(()=> { this.test() }, 1000); // not started so start the interval   
      this.started = true;
    } else if (this.started) {
      this.started = false;  // Its started so stop it');
      clearInterval(intervalId);
    }
  }