时间戳

首页 > 解决方案 > 从 Angular 5 中的 http.get 返回单个项目的 Observable

angular - 从 Angular 5 中的 http.get 返回单个项目的 Observable

问题描述

我有一个将请求发送到 in-memory-web-api 的服务。该服务包括一个方法，我想（通过查询字符串）查询单个项目的 API。

无论在通用 http.get 方法中指定单个项目，我都会返回一个数组。

这与我只返回单个项目时使用 ID 而不是查询调用单个项目的 API 不同。

this.http.get<ITrack>(`api/tracks/1`)
  .subscribe(track => console.log(JSON.stringify(track)));

返回

{"id":1,"artist":"Radiohead","name":"OK Computer","durationSeconds":61,"nominator":null,"playlistPosition":1}

然而

this.http.get<ITrack>(`api/tracks/?playlistPosition=1`)
  .subscribe(track => console.log(JSON.stringify(track)));

返回

[{"id":1,"artist":"Radiohead","name":"OK Computer","durationSeconds":61,"nominator":null,"playlistPosition":1}]

我可以通过以下方式获得第二个电话以仅返回项目：

this.http.get<ITrack>(`api/tracks/?playlistPosition=1`)
.pipe(
  map(t => t[0])
)
.subscribe(track => console.log(JSON.stringify(track)));

但是我不能使用像 single 或 first 这样的方法，因为编译器期望返回类型为 ITrack。

在这里退货的正确方法是什么？

标签： angularangular5observable

解决方案

因此，如果端点总是返回一个列表，请调用get使用 -array 键入的方法ITrack。

只需替换.get<ITrack>(...)为.get<ITrack[]>(...).

推荐阅读