基于响应递归组合HTTP结果

There's an API(https://panelapp.genomicsengland.co.uk/api/v1/panels/?page=1) that I want to consume all the data to my angular apps. The problem is that their API have pagination, and I want to retrieve all of the content at once.As you can see on the API, they actually have "next" attribute on their response which point to the next page. I want to be able to keep requesting from the API as long as "next" attribute is not null then combine all their response into one.I have tried using recursive, but by the time it reach the 2nd loop I get undefined value. My guess is that its because async request, hence I get undefined. Below is my code@Injectable()export class GenomicsEnglandService { panels = []; constructor(private http: HttpClient) { } getPanels(url): Observable<any>{ const headers = new HttpHeaders() .append('Content-Type', 'application/json') .append('Accept', '*/*'); return this.http.get(url, {headers: headers}) .map((data) => { panels = panels.concat(data.results); if(data.next){ this.getPanels(data.next); }else{ return panels; } }) .catch((e) => { Raven.captureMessage("GENOMICS ENGLAND ERROR: " + JSON.stringify(e)); return of([]); }); }}Then from my component I just called this.GenomicsEnglandService.getPanels('https://panelapp.genomicsengland.co.uk/api/v1/panels/?page=1').subscribe(data => { console.log(data);}) 解决方案 Although this question has been answered, I would like to propose another approach by using expand operator [https://rxjs-dev.firebaseapp.com/api/operators/expand]. expand operator is made for such recursive purposes:getResult() { const url = "https://panelapp.genomicsengland.co.uk/api/v1/panels/"; return this.getResponse(url) .pipe( expand((res: any) => this.getResponse(res.next)), takeWhile((res: any) => res.next, true), concatMap((res: any) => res.results), reduce((acc, val) => { acc.push(val); return acc; }, []), tap(_ => { console.log(_); this.loading = false; }) ) } getResponse(url) { return this.httpClient.get(url); }See working stackblitz 这篇关于基于响应递归组合HTTP结果的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！