首页 文章

有条件地将rxjs数组响应合并到一个数组中

提问于
浏览 次
0

在我的Angular 6服务中，我有以下方法从Spotify Web API获取当前用户的前50个播放列表：

getPlaylists(accessToken: string): Observable<Playlist[]> {
  const httpOptions = {
    headers: new HttpHeaders({
      'Authorization': `Bearer ${accessToken}`
    })
  };

  return this.httpClient.get<Playlist[]>('https://api.spotify.com/v1/me/playlists?limit=50', httpOptions)
    .pipe(map((response: any) => response.items));
}

如果当前用户只有50个或更少的播放列表，这就足够了 .

但是，如果用户的播放列表超过50个，则Spotify Web API会将单个响应中的播放列表数限制为50，而 response 对象包含 next 属性，该属性是 endpoints 请求下50个播放列表的URI .

我想扩展 getPlaylists 函数以获取所有用户的播放列表，即：只要 response 对象包含有效的 next 属性，我想继续向它包含的URI发送 GET 请求，最后合并结果 response.items 数组使函数返回单个 Observable<Playlist[]> .

我该怎么做呢？

谢谢！

编辑：我正在使用的Spotify Web API endpoints 是https://developer.spotify.com/documentation/web-api/reference/playlists/get-a-list-of-current-users-playlists/

angular typescript rxjs spotify

1 回答

  • 2

    您可以使用.mergeMap()来帮助您将高阶Observable展平为单个流 .

    Hello World的简单示例

    //emit 'Hello'
const source = Rx.Observable.of('Hello');
//map to inner observable and flatten
const example = source.mergeMap(val => Rx.Observable.of(`${val} World!`));
//output: 'Hello World!'
const subscribe = example.subscribe(val => console.log(val));

    <script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/5.1.0/Rx.js"></script>

    为了更好地理解 .map() 和 .mergeMap() 之间 - 检查这个question和answer

    回复于

相关问题