Question

我尝试发送http-request。我使用angular 2和rxjs库。我需要发送一个5秒的请求。

首先我导入运算符并使用它：

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
// import { interval } from 'rxjs/observable/interval';
import 'rxjs/add/observable/interval';

@Injectable()
export class TasksService {
  constructor(private http: HttpClient) { };
  getUserTasks(userId): Observable<any> {
    return this.http.interval(5000).get('http://127.0.0.1:8000/app_tasks/user_tasks?user_id=' + userId);
  };
}

其次我订阅了组件：

ngOnInit() {
  let userId = 1;
  this.getUserTasks(userId);
}

private getUserTasks(userId): void {  
  this.tasksService.getUserTasks(userId).subscribe(
    data => {   
      this.userTasks = JSON.parse(data);                 
      console.log('userTasks', this.userTasks);
    }
  )
};

但是consoe显示以下错误消息：

src / app / services / tasks.service.ts（16,21）中的错误：错误TS2339： 'HttpClient'类型中不存在属性'interval'。

Answer 1

Interval是Observable的创建者函数，而不是HttpClient。我会尝试以下方法：

Observable.interval(5000)
  .switchMap(_ => this.http.get('http://127.0.0.1:8000/app_tasks/user_tasks?user_id=' + userId)

通过使用.switchMap，如果在您的上一个请求返回之前达到新的间隔（5秒，希望不会发生），您将放弃之前的http.get结果。

Answer 2

我认为在Angular 4+上你应该使用IntervalObservable。您可以阅读有关此旧问题（Angular2+ http at an interval）的版本更改的更多信息，或使用正确答案@Ploppy https://stackoverflow.com/a/40285206/5319874

Answer 3

根据接受的答案。如果请求超过5秒，switchMap将不是最好的主意。作为替代方案，我宁愿建议exhaustMap：

Observable.interval(5000)
 .exhaustMap(_ => this.http.get(`http://127.0.0.1:8000/app_tasks/user_tasks?user_id=${userId}`)

5秒后它不会取消待处理的请求，但在待处理的请求失败或返回值之前忽略任何请求。但这取决于你的情况。

如何通过间隔运算符发送请求？

3 个答案: