将 json 数据更改为 Angular 2 中的 Typescript 接口对象

Posted 2023-03-13

【中文标题】将 json 数据更改为 Angular 2 中的 Typescript 接口对象

【英文标题】：Change json data to Typescript interface objects in Angular 2

【发布时间】：2016-11-04 20:10:25

【问题描述】：

我有如下结构的 json 数据：

  "timestamp": 1467471622,
  "base": "USD",
  "rates": 
    "AED": 3.673027,
    "AFN": 68.475,
    "ALL": 123.095199,
    "AMD": 476.8075,
    "ANG": 1.78385,
    "AOA": 165.846832,
    "ARS": 15.05143,
    "AUD": 1.333463,
    "AWG": 1.793333,
    "AZN": 1.553975,
    "BAM": 1.757679,
    "BBD": 2,
    "BDT": 78.33184,
    "BGN": 1.756683,
    "BHD": 0.377337,
    "BIF": 1660.642515,
    "BMD": 1,
    "BND": 1.344589,

如何将它映射到 typescript 中的多个对象，如下所示：

export interface Stock 
  name: string;
  value: number;

谢谢

【问题讨论】：

你到底是什么意思？ json 数据中没有股票名称，按价值计算，您只想要美元的价格吗？我要做的是写一些代表json数据结构的接口，然后写一些我想在应用程序中使用数据的接口，然后写一些代码来映射它们之间的数据。

其实这个数据好像代表的是货币汇率。我看到base 是美元，目前 1 美元 ≈ 1.33 澳元。那么叫它Stock 可能不太好。

【参考方案1】：

您不需要手动映射。您的 Typescript 代码可以是：

export interface Stock
  timestamp : Number,
  base : String,
  rates : Rates


export class Rates
  AED : Number,
 ..... so on

【参考方案2】：

let keys = Object.keys(data.rates);
let mapped: Stock[] = keys.map(key => 
    return  name:key, value: data.rates[key]  as Stock
);

console.log(mapped);

https://jsfiddle.net/qfo43o24