将对象的 Angular Http 响应转换为接口类型数组

Question

所以我有一个返回数据的响应，如下所示：

{
    "0": {
        "name": "Novartis AG",
        "symbol": "NVS",
        "has_intraday": false,
        "has_eod": true,
        "country": null,
        "stock_exchange": {
            "name": "New York Stock Exchange",
            "acronym": "NYSE",
            "mic": "XNYS",
            "country": "USA",
            "country_code": "US",
            "city": "New York",
            "website": "www.nyse.com"
        },
        "stock": {
            "open": 84.845,
            "high": 85.39,
            "low": 84.845,
            "last": 85.33,
            "close": 84.24,
            "volume": 3700,
            "date": "2022-01-27T14:40:00+0000",
            "symbol": "NVS",
            "exchange": "IEXG"
        }
    },

显然，它是一个包含更多对象的 object。 我有一个看起来像这样的界面：

export interface Stock {
  ticker: string;
  name?: string;
  open?: number;
  high?: number;
  low?: number;
  last?: number;
  close?: number;
}

我想要做的是让我的服务调用中的响应成为一个 Stock 数组，所以：

getStocks(): Observable<Array<Stock>> {
...
}

我很难想出一种方法来将这个奇异的 object 可观察对象转换为我的 Stock 类型可观察对象数组。 我真的很感激任何帮助！

Answer 1

您可以使用“map”rxjs/operator 和数组的“map”方法。

所以你 function 可以像

getStocks(){
   this.httpClient.get("....").pipe(
     map((res:any)=>{
        //res is your object
        
        //you "iterate" over Object.keys(res)
        //will be "0", "1", "2"...

        //so, e.g. res[x] is 
        const result=Object.keys(res).map(x=>({
              ticker:res[x].acronym,
              name:res[x].stock_exchange.name,
              open:res[x].stock.open,
              high:res[x].stock.high
              ...others properties...
         }))
        return result;
     }
   ))
}

看到第一个 map， pipe(map(...))把你的 object 转换成另一个 object -记住，当你在里面使用map=>{...}时总是需要返回，