typescript 如何在 Angular 2 中每 10 秒调用一次函数?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/44651463/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-21 04:39:07  来源:igfitidea点击:

How do I call a function in every 10 seconds in Angular 2?

angulartypescriptangular2-template

提问by Umair Khan

How do I call a function in a set Time interval in Angular 2. I want it to be called/Triggered at specific time intervals(for eg 10 secs). For Eg: ts File

如何在 Angular 2 的设定时间间隔内调用函数。我希望它在特定时间间隔(例如 10 秒)被调用/触发。例如:ts 文件

num: number = 0;
array: number[] = [1,5,2,4,7];
callFuntionAtIntervals(){
    if(num==5){
        num=0;    
    }
    num++;
}

HTML:

HTML:

<div>{{ array[num] }}</div>

So basically the div value will change at intervals

所以基本上div值会每隔一段时间改变

回答by elzoy

Observable.interval(10000).takeWhile(() => true).subscribe(() => this.function());

Observable.interval(10000).takeWhile(() => true).subscribe(() => this.function());

infinite loop where every each 10 seconds function()is being called

无限循环,每 10 秒function()被调用一次

回答by SubbU

You may also try the traditional setInterval function.

您也可以尝试传统的 setInterval 函数。

setInterval(() => {
    this.callFuntionAtIntervals();
}, 1000);

回答by SubbU

In your TS logic, define an observable based on an "interval", which will emit the values 0, 1, 2, 3, 4, 0, 1, ...

在您的 TS 逻辑中,定义一个基于“间隔”的可观察对象,它将发出值 0、1、2、3、4、0、1、...

this.index = Observable.interval(10000).map(n => n % this.array.length);

In your component, unwrap that observable using asyncand use it to index into the array.

在您的组件中,使用解包该 observableasync并使用它来索引数组。

{{array[index | async]}}

回答by Vishwa G

Please check below it might be some helpful,

请在下面检查它可能会有所帮助,

My requirements: Like every 5 secs need to call a service if we get back required data we need to stop calling the service and continue with next flow. Else call service again after 5 seconds.

我的要求:就像每 5 秒需要调用一次服务一样,如果我们取回所需的数据,我们需要停止调用该服务并继续下一个流程。否则 5 秒后再次呼叫服务。

Conditions to stop service invocation were like after max number of retries (in my case 20 times) or after certain time (in my case 120 seconds).

停止服务调用的条件是在最大重试次数后(在我的情况下为 20 次)或在特定时间后(在我的情况下为 120 秒)。

Note: I was using in typescript

注意:我在打字稿中使用

let maxTimeToRetry = 120000;  // in ms
let retryCount = 0;
let retryTimeout = 5000; // in ms
let maxRetries = 20;
const startTime = new Date().getTime();

// Need to use self inside of this, inside setInterval method;

const interval = setInterval(function () {
    retryCount++;  // INCREMENT RETRY COUNTER
    self.service.getData(requestParams).subscribe(result => {
      if (result.conditionTrue) {
        clearInterval(interval); // to stop the timer or to stop further calling of service
        //any execution after getting data
      }
    });

    if ((new Date().getTime() - startTime > maxTimeToRetry) || (retryCount === maxRetries)) {
      clearInterval(interval);
      // any execution 
    }

  }, retryTimeout);