viplist.component.html

<table class="table table-striped table-hover">
  <thead>
    <tr>
      <th>Description</th>
      <th>shortdesc</th>
    </tr>
  </thead>


  <tbody>
    <tr *ngFor="let vip of vips | async">
      <td>{{vip.description}}</td>
      <td>{{vip.shortdescr}}</td>
      <td>
        <div>
          <div *ngFor="let p of vip.products">
            <div style="display: inline-block;">{{p.name}}</div>
            <div style="display: inline-block;">{{p.quantity}}</div>
          </div>
        </div>
      </td>
    </tr>
  </tbody>


</table>