Как рекурсивно выполнить HTTP-запрос в угловых? - PullRequest
0 голосов
/ 28 июня 2019

Мне нужно отправить запрос на получение конечной точке, которая содержит список сообщений и ключ от общего количества сообщений.

{
    posts: [{}, {}, {}, ...],
    total: 1000
}

смещение ключ для запроса определяет количество возвращаемых сообщений.

// request
https://postBalzer.com/posts?offset=0&limit=50

этот запрос возвращает сообщения от 0 до 50 Как сделать вызов рекурсивным, пока все сообщения не будут получены с помощью Angular HttpClientModule.

Как я могу использовать оператор расширения rxjs в таком случае?

Ответы [ 2 ]

1 голос
/ 28 июня 2019

Это можно сделать в rxjs с помощью оператора expand следующим образом:

import {HttpParams} from '@angular/common/http';
import {Observable, empty} from 'rxjs';
import {expand, map, reduce} from 'rxjs/operators';

export interface PostResponse {
  posts: object[];
  total: number;
}

@Injectable()
export class Service {
  private readonly baseUrl = '...';

  constructor(private http: HttpClient) {
  }

  getPosts(chunkSize: number): Observable<object[]>
  {
    let chunkOffset = 0;
    return this.getPostsChunk({chunkOffset++, chunkSize}).pipe(
      expand(({total}) => total >= chunkOffset * chunkSize
                                ? getPostsChunk({chunkOffset++, chunkSize})
                                : empty()
      ),
      map(res => res.posts),
      // if you want the observable to emit 1 value everytime that
      // a chunk is fetched, use `scan` instead of `reduce`
      reduce((acc, val) => acc.concat(val), new Array<object>()),
    );
  }

  getPostsChunk({chunkOffset, chunkSize}: {chunkOffset?:number, chunkSize:number})
  {
     const offset = (chunkOffset || 0) * chunkSize;
     const limit = offset + chunkSize;
     const params = new HttpParams({offset, limit});
     return this.http.get<PostResponse>(this.baseUrl, {params});
  }
}

Учитывая, что вы можете "рассчитать" количество запросов, необходимых для получения всех записей записей из итоговое значение, полученное после 1-го запроса, вы можете наиболее точно реализовать это другим способом, не используя оператор expand.

0 голосов
/ 28 июня 2019
getData() {
    if (this.total < 50) {
        this.service().subscribe((response) => {
            this.total += response.length;
            this.getData()
        })
    }
}
...