How do I periodically trigger a function to update data in each instance of the Angular 5 application?

Question

I need to have a data list updated every 5/10 minutes, this data which is brought from a Spring Boot API with Mysql storage, through a request made by Angular. I would like to know some way to keep repeating this request and so updating the data.

Answer 1

You can use the library Rx-Polling, with it you can make periodic requests by setting an interval.

Follow an example:

import {Component} from '@angular/core';
import {Http} from '@angular/http';
import 'rxjs/Rx'; // Não se esqueça de importar adequadamente :)
import {Observable} from 'rxjs/Rx';

@Component({
    selector: 'app',
    template: `
      <ul>
        <li *ngFor="let dado of dados">{{dado.meuDado}}</li>
      </ul>

      `
})

export class MyApp {
  private dados = [];
  observableDados: any;      

  constructor(http: Http) {
   this.observableDados = Observable.interval(5000) // Intervalo de polling (5 segundos nesse caso)
    .switchMap(() => http.get('http://minhaapirest.com/dados/')).map((data) => data.json()) // Requisição para sua API
        .subscribe((data) => {
           this.dados = data; 
           console.log(data); // Log para demonstração :)
        });
  }

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