Parsa JSON-sträng från API i Angular


Jag har ett API som returnerar följande data:

[
  {
    "id": 1,
    "symbol": "20MICRONS",
    "series": "EQ",
    "isin": "INE144J01027",
    "created_at": "2018-03-05 16:24:10",
    "updated_at": "2018-03-05 16:24:10"
  },
  {
    "id": 2,
    "symbol": "3IINFOTECH",
    "series": "EQ",
    "isin": "INE748C01020",
    "created_at": "2018-03-05 16:24:10",
    "updated_at": "2018-03-05 16:24:10"
  },
  {
    "id": 3,
    "symbol": "63MOONS",
    "series": "EQ",
    "isin": "INE111B01023",
    "created_at": "2018-03-05 16:24:10",
    "updated_at": "2018-03-05 16:24:10"
  },
  {
    "id": 4,
    "symbol": "VARDMNPOLY",
    "series": "EQ",
    "isin": "INE835A01011",
    "created_at": "2018-03-05 16:24:10",
    "updated_at": "2018-03-05 16:24:10"
  }
]   

Jag vill analysera detta svar från API:et i Angular. Jag kan logga datan i konsolen men kan inte mappa den till datatypen.

export class SymbolsComponent implements OnInit {

  allSymbols: Symbols[] = [];

  constructor(private http: HttpClient, private apiUrl: ApiUrlService) { }

  ngOnInit() {
    this.fetchListOfAllSymbol();
  }

  fetchListOfAllSymbol() {
    this.http.get(this.apiUrl.getBaseUrl() + 'symbol').subscribe(data => {
        console.log(data);

    });
  }

} 

Min modelfil ser ut så här:

export class Symbols {

  constructor(private symbol: string, private series: string, private isin: string, private created: string) {

  }

}

Efter att ha fått svar från API:et behöver jag fylla på resultatet i allSymbols-variabeln.

Svar #1

Dina JSON-objektegenskaper är inte 100% matchade för Symbols, du måste konvertera dem.

Här är ett exempel, gränssnittet ServerSymbols innehåller alla egenskaper i JSON-objektet, nu kan du ändra fetchListOfAllSymbol() som:

fetchListOfAllSymbol() {
    this.http.get<ServerSymbols[]>(this.apiUrl.getBaseUrl() + 'symbol')
      .subscribe((data: ServerSymbols[]) => {
        console.log(data);
        // convert ServerSymbols to Symbols 
      });
}

GET skulle returnera en lista över ServerSymbols

export interface ServerSymbols {
    id: number;
    symbol: string;
    series: string;
    isin: string;
    created_at: string;
    updated_at: string;
}

Konvertera ServerSymbols-objekt till Symbols-objekt:

convertFromServer(serverSymbols: ServerSymbols): Symbols {
    return new Symbols(serverSymbols.symbol, serverSymbols.series, serverSymbols.isin, serverSymbols.created_at);
}