所以这里是函数
greenToAmber() {
let x = 0;
setInterval(function () {
x++;
..... Rest of code
}, 500);
}
}
正如您所期望的那样,我已经使用路由设置了这个组件,我也尝试在OnInit中调用该函数,但是每次我去这个组件然后关闭它并再次返回计数器都会启动计数器的第二个实例
从我的理解,我认为ngOnDestroy是为了防止这种情况,我假设我需要订阅,然后取消订阅功能,也许在销毁?
但我对角4相对较新,所以相当缺乏经验。
setInterval不会在组件销毁时销毁,您必须将间隔id保存在您的类中并使用clearInterval javascript原生函数在您的组件销毁钩子ngOnDestroy
上清理它:
import {Component, OnDestroy} from '@angular/core';
@Component({ ... })
export class YourClass implements OnDestroy {
public intervalId: any;
public greenToAmber() {
let x = 0;
// registering interval
this.intervalId = setInterval(function () {
// ..... Rest of code
}, 500);
}
}
public ngOnDestroy () {
if (this.intervalId !== undefined) {
clearInterval(this.intervalId); // cleaning interval
}
}
}
希望有帮助。
您正在使用setInterval
设置一个恶魔进程。您提到的行为是预期的。这就是JavaScript的工作方式。它不是Angular特定的。
SetInterval总是返回一个您可能想要在控制器中跟踪的ID。当您想要销毁它时,请确保您专门这样做。
例如:
greenToAmber() {
let x = 0;
$scope.myDemon = setInterval(function () {
x++;
..... Rest of code
}, 500);
}
}
//Somewhere else; where you want to destroy the interval/stop the interval:
If($scope.myDemon) {
clearInterval($scope.myDemon);
}