Question

我需要向一个端点发出get请求，该端点包含一个帖子列表和一个总帖子关键字。

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

请求的偏移量键确定返回的帖子数。

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

此请求返回0到50之间的帖子如何使调用递归直到使用Angular HttpClientModule提取所有帖子。

在这种情况下如何使用expand rxjs运算符？

Answer 1

这可以通过使用expand运算符在rxjs中完成，如下所示：

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});
  }
}

考虑到您可以“计算”从第一个请求后获得的 total 值中获取所有帖子条目所需的请求数，因此您可以最确定地以其他方式实现此目标，而无需使用expand运算符。

Answer 2

getData() {
    if (this.total < 50) {
        this.service().subscribe((response) => {
            this.total += response.length;
            this.getData()
        })
    }
}

如何在angular中递归执行HTTP请求？

2 个答案: