title: How to get data from array in JSON - Angular 7+
body: <p>I'm completely beginning in Angular and API. I'm trying to resolve some problem. My task is simple i guess. I have to get currency exchange rates data from NBP Web API. JSON file looks like: </p>
  
  <p><a href="https://i.stack.imgur.com/kO0Cr.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/kO0Cr.png" alt="enter image description here"></a></p>
  
  <p>I've found solution how to get some data from JSON, but i still have problem with array. The json file was converted to typescript and the result was : </p>
  
  <p><a href="https://i.stack.imgur.com/Ci66w.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Ci66w.png" alt="enter image description here"></a></p>
  
  <p>So my Code look's like that: </p>
  
  <blockquote>
    <p>Exchange.model.ts</p>
  </blockquote>
  
  <pre><code> export interface Exchange {
    table: string;
    no: string;
    effectiveDate: string;
    rates: Rate[];
  }
  
  export interface Rate {
      currency: string;
      code: string;
      mid: number;
    }
  </code></pre>
  
  <blockquote>
    <p>app.component.ts</p>
  </blockquote>
  
  <pre><code>import { Component, OnInit } from '@angular/core';
  import { Exchange, Rate } from './exchange.model';
  
  import { DataService } from './data.service';
  
  @Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css']
  })
  export class AppComponent implements OnInit {
  
    exchanges$: Exchange;
    rates$: Rate;
  
    constructor(private dataService: DataService) {}
  
    ngOnInit() {
      return this.dataService.getExchanges().subscribe(data =&gt; this.exchanges$ = data)
  
  
    }
  
    ngOnInit2() {
      return this.dataService.getRates().subscribe(data =&gt; this.rates$ = data)
  
  
    }
  }
  </code></pre>
  
  <blockquote>
    <p>and app.component.html</p>
  </blockquote>
  
  <pre><code>&lt;div *ngFor='let exchanges of exchanges$'&gt;
          &lt;h2"&gt;{{exchanges.table}}  &lt;br&gt; {{exchanges.no}} &lt;br&gt; {{exchanges.effectiveDate}}&lt;/h2"&gt;
              {{exchanges.rates}}
  
  &lt;/div&gt;
  </code></pre>
  
  <p>The browser display the data like that:</p>
  
  <p><a href="https://i.stack.imgur.com/FCbSl.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/FCbSl.png" alt="enter image description here"></a></p>
  
  <p>The result is almost good. But the data from <strong>"rates"</strong> in JSON doesn't work. </p>
  
  <pre><code>"rates":[ 
  { 
  "currency":"bat (Tajlandia)",
  "code":"THB",
  "mid":0.1261
  },"
  </code></pre>
  
  <p>How to solve a problem? <strong>How to get data from array in JSON into typescript?</strong> What input into array in Exchange.module.ts?
  I know that, a question is long, but I wanted to display necessary code and images.</p>