使用Angular HTTP Observable的轮询API

时间:2018-06-27 05:47:57

标签: angular typescript rxjs angular-httpclient

在我的组件html中,我正在使用asyncPipe订阅此http服务。该服务将json响应对象映射到类实例的数组。这一切都很好,但是我希望http服务每隔几秒钟轮询一次。我已经尝试了很多事情(例如间隔),但目前看来RXJS有点雷区。有没有人使用Angular 6实现这种事情?

fetch(command, params?) {
    return this.http.post(`http://localhost:4000/${command}`, params)
      .pipe(
        map((data: Data) => {
          const statuses: Status[] = [];
          for (const statusKey of Object.keys(data.statuses)) {
            const newStatus = new Status(
               // do some object translation...
           );
           statuses.push(newStatus);
          }
        return statuses;
        })
      )
      .pipe(
        catchError(EpisodeApiService.handleError)
      );
  }

2 个答案:

答案 0 :(得分:2)

这应该像下面这样简单:

    pollInterval = 5000;
    const httpObservable = interval(pollInterval).pipe(
    switchMap(x => fetch(command, params?) )
   );

pollInterval可以根据要求进行更改。 intervalswitchMap的导入方式如下:

import {interval} from 'rxjs';
import {switchMap) from 'rxjs/operators'; 

在此处使用switchMap有助于取消任何延迟的挂起的http请求,这特别对于间歇性Internet连接期间的性能很有用。这就是为什么RxJS反应性方法比传统方法(例如setInterval())更受青睐的原因。

还应最终进行订阅,否则将不会发生任何事情:

httpObservable.subscribe(x => {});

答案 1 :(得分:0)

如果您不想使用rxjs,也可以这样做

 setInterval(function(){
      serviceObj.httpObservable.subscribe(x => {});
    }, 10000)