how to display json value in table

Question

I have a table which shows the below data in the grid.Each value have a column in the table.I displayed all data by calling the api. I dont know how to display the currencies code,name,symbol,languages in the table.Can anyone help me to sort this out?

[
{
"name": "Afghanistan",
"topLevelDomain": [
  ".af"
],
"currencies": [
  {
    "code": "AFN",
    "name": "Afghan afghani",
    "symbol": "؋"
  }
],
"languages": [
  {
    "iso639_1": "ps",
    "iso639_2": "pus",
    "name": "Pashto",
    "nativeName": "پښتو"
  },
  {
    "iso639_1": "uz",
    "iso639_2": "uzb",
    "name": "Uzbek",
    "nativeName": "Oʻzbek"
  },
  {
    "iso639_1": "tk",
    "iso639_2": "tuk",
    "name": "Turkmen",
    "nativeName": "Türkmen"
  }
],
"translations": {
  "de": "Afghanistan",
  "es": "Afganistán",
  "fr": "Afghanistan"
}
}
 }]

Answer 1

You can just do like:

<table>
<tr>
    <td>{{data.name}}</td>
    <td>
        <span *ngFor="let item of data.currencies">
            Code: {{item.code}}
            Name: {{item.name}}
            Symbol: {{item.symbol}}
        </span>
    </td>
</tr>

data is the item of your json.