angular call function every x seconds

How to call a function every x seconds in Angular

If you want to call a function every x seconds in Angular, there are several ways to achieve it. One of the easiest ways is to use the setInterval() method in JavaScript. Here's how you can do it:


// Declare a function that you want to call every x seconds
function myFunction() {
  console.log('This function is called every x seconds');
}

// Call the setInterval() method with your function and time interval
setInterval(myFunction, 1000); // This will call the function every second

In the code above, we first declare a function called myFunction() that we want to call every x seconds. Then, we use the setInterval() method to call this function with a time interval of 1000 milliseconds (1 second).

In an Angular application, you can use this approach by calling the setInterval() method within a component or service. Here's an example:


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

@Component({
  selector: 'app-root',
  template: '<h1>Hello World!</h1>',
})
export class AppComponent {
  intervalId: any;

  ngOnInit() {
    this.intervalId = setInterval(() => {
      this.callMyFunction();
    }, 1000);
  }

  ngOnDestroy() {
    clearInterval(this.intervalId);
  }

  callMyFunction() {
    console.log('This function is called every x seconds');
  }
}

In the code above, we declare an intervalId variable to hold the ID of the interval returned by the setInterval() method. We then call the setInterval() method within the ngOnInit() lifecycle hook to call the callMyFunction() function every second. We also implement the ngOnDestroy() lifecycle hook to clear the interval when the component is destroyed.

Another approach to call a function every x seconds is to use the rxjs library in Angular. Here's an example:


import { Component } from '@angular/core';
import { interval } from 'rxjs';

@Component({
  selector: 'app-root',
  template: '<h1>Hello World!</h1>',
})
export class AppComponent {
  subscription: any;

  ngOnInit() {
    this.subscription = interval(1000).subscribe(() => {
      this.callMyFunction();
    });
  }

  ngOnDestroy() {
    this.subscription.unsubscribe();
  }

  callMyFunction() {
    console.log('This function is called every x seconds');
  }
}

In the code above, we use the interval() method from the rxjs library to create an observable that emits a value every second. We then subscribe to this observable and call the callMyFunction() function. We also implement the ngOnDestroy() lifecycle hook to unsubscribe from the observable when the component is destroyed.

These are two ways to call a function every x seconds in Angular. Choose the approach that best suits your use case.

Subscribe to The Poor Coder | Algorithm Solutions

Don’t miss out on the latest issues. Sign up now to get access to the library of members-only issues.
[email protected]
Subscribe