angular - 将 http 响应映射到 typeScript 对象

Question

我正在尝试将 API 响应(json 字符串数组)转换为 typescript 对象，但无法实现 .我尝试添加 map 功能，但无法正常使用。

示例 API 响应是 ["Paris","London","New York"]

我的City类是这样的

export class City { Name:string; 
                    isAvailable: boolean;
                  }

我的功能

public getCities(queryId: string) : Observable<City[]> {
              const url = apiUrl;

              const response = this.http.get<string[]>(url)
                                   .pipe(catchError(this.handleError));
             //how can i add map method here to convert String to City object?

              return response;

         }

我期望这样的输出

[
  {Name:"Paris",isAvailable:true},
  {Name:"London",isAvailable:true}, 
  {Name:"New York",isAvailable:true}
]

Answer 1

如果您希望在 RxJS 管道中处理此问题，您可以这样做。我们使用 RxJS map运算符将响应转换为 City 对象数组。

public getCities(queryId: string) : Observable<City[]> {
  const url = apiUrl;

  return this.http.get<string[]>(url)                                
    .pipe(
      map((res) = {
        return res.map(name => ({
          Name: name,
          isAvailable: true,
        });
      }),
      catchError(this.handleError));   
}