如何在 Angular 中实时异步地从 REST API 获取数据

Question

In my component file i use the http client to get an observable of the json file from an api endpoint:

this.data =  this.http.get(api);

in the template i am binding the data field using the async pipe:

<td *ngFor="let post of (data | async)"> {{post.title}} </td>

Now i am getting the data, the problem is that i want it to happen in realtime without having to refresh the page. So is there anyway i can achieve asynchronous data loading

PS
I have already tried some workarounds like setting interval to continuously subscribe to the observable but that would just deplete resources and it seems like there's another cleaner way that i am missing.

Answer 1

You can't do anything at front side for making it real time. Async pipe will keep eye on response but in order to get response you must have to hit API after some Time interval or something similar. As you already said it's not cleaner solution. You can achieve this using web socket which is back end thing. Some of databases are real time in nature by default. Firebase is one of them.