title: Displaying JSON as list in Angular 7
body: <p>I want to display the list of the data (received as JSON) but it looks like I am missing something and it does not display the data. Here's my code:</p>
  
  <p>Service:</p>
  
  <pre><code> getData() {
      this.http.post('http://localhost/api/Acc/GetData', "").subscribe(res =&gt; {
      return res;
     });
   }
  </code></pre>
  
  <p>Component:</p>
  
  <pre><code>  constructor(private api: ApiService) {
       var data = api.getData();   
    }
  </code></pre>
  
  <p>Template:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;mat-list&gt;
  &lt;mat-list-item *ngFor="let item of data"&gt;
  &lt;h4 matLine&gt; {{item.Field1}} &lt;/h4&gt;
  &lt;/mat-list-item&gt;
  &lt;/mat-list&gt;
  </code></pre>
  
  <p>There are some weak points I can see:</p>
  
  <ol>
  <li><p>I am not sure if <code>getData</code> uses the proper way of returning the data</p></li>
  <li><p>I am not sure whether constructor properly stores the data, but I tried some other options and nothing helped.</p></li>
  </ol>