angular - Angular 5 服务中的 SetTimeout

Question

我想在我的服务中有一个属性 currentAndLastVehicles，它会每秒自动更改。

到目前为止:

import { Injectable } from '@angular/core';

@Injectable()
export class SharedDataService {

  constructor() {
    setTimeout(() => {
      console.log("hello");
      this.currentAndLastVehicles = [(Math.floor(Math.random() * (1000000 - 9999999)) + 9999999).toString(),...this.currentAndLastVehicles];
    }, 1000);
  }

  public currentAndLastVehicles : string[] = [];
}

问题:

• setTimeout 只会执行一次(很可能是因为 setTimeout 位于构造函数中)
• setTimeout 在构造函数之外导致多个错误

我该怎么做才能达到预期的行为？

Answer 1

使用setInterval。

在您调用 clearInterval 之前，它将被执行。您可以通过在服务中创建一个方法来调用 clearInterval 并执行 AppComponent 的 ngOnDestroy

在你的构造函数中你应该使用变量

constructor(){
     this.clearIntervalInstance = this.myFunction();
}

你应该在你的服务中有这样的功能

myFunction() {
   setInterval(()=>{
      this.currentAndLastVehicles = [(Math.floor(Math.random() * (1000000 - 9999999)) + 9999999).toString(),...this.currentAndLastVehicles];
},10000)

在应用组件中

ngOnDestroy() {
  this.service.clearIntervalMethod()
}

为您服务

clearIntervalMethod(){
  clearInterval(this.clearIntervalInstance);
}