mardi 23 novembre 2021

How to do polling in Ember js component?

In ember js 3.24 LTS, I can create a component that receive data from an API call inside a route. The data from the API is an activity logs. The complexity arrives when I try to keep updating the logs with the latest logs, I need to keep polling the API every few seconds and I need to keep updating the data that being displayed inside the component.

  • How do I keep reloading the API call every few seconds and then update the display of the component?
  • I can use the ember later to keep looping/requery the API ever 2 seconds or 2000 ms, but then how do I tell my component to update the display?

This component gets data from an API call which is in the routes.

// addon/routes/single-scan/index.js 
import { later } from '@ember/runloop';
...
  async model() {
    let phaseActivityLog = await this.pollTestActivity(testId);
    return { phaseActivityLog };
  }

  async pollTestActivity(testId) {
    later(
      this,
      function () {
        this.pollTestActivity(testId);
      },
      2000
    );
    let phaseActivityLog = await this.store.query('phase-activity-log', testId, { reload: true }); // poll this
    return phaseActivityLog;
  }

And my component hbs

// components/single-scan/phase-activity-log.hbs


   -  - 




Aucun commentaire:

Enregistrer un commentaire