如何使用angular2在组件init上只运行一次间隔？

我在我的组件中启动了一个间隔：

export class FoobarComponent implements OnInit {

    ngOnInit(): void {
        this.startInterval();
    }

    startInterval() void {
        setInterval(() => { console.log('Hi'); }, 1000);
    }    
}

每次调用组件时，都会在以前的间隔之外创建一个新的间隔

我试着用一个ID（就像我以前用普通JS做的那样）做一些类似的事情：

export class FoobarComponent implements OnInit {

    intervalId: Number;

    ngOnInit(): void {
        this.startInterval();
    }

    startInterval() void {
        if(this.intervalId) { // always undefined 
            window.clearInterval(this.intervalId);
        }
        this.intervalId = window.setInterval(() => { console.log('Hi'); }, 1000);
    }
}

但它不起作用，因为每次调用组件时，

intervalId

都变得未定义。因此，在创建新的间隔时，以前的间隔将继续运行

我不知道如何停止已经开始的间歇。

---

你能帮我做一下吗？

你可以使有效期静态。这样，所有类实例都可以访问同一个类实例

导出类FoobarComponent实现OnInit{
静态有效期：数字；
ngOnInit（）：void{
这个.startInterval（）；
}
startInterval（）空{
if（FoobarComponent.intervalId）{//始终未定义
window.clearInterval（this.intervalId）；
}
FoobarComponent.intervalId=window.setInterval（（）=>{console.log（'Hi'）；}，1000）；
}
}

设置intervalID static，这样您就可以访问所有组件。因此，请将答案标记为正确答案，以便将来的读者知道这是正确的方法。：）