<p-table [value]="productsStyle" responsiveLayout="scroll">
  <ng-template pTemplate="header">
    <tr>
      <th>Code</th>
      <th>Name</th>
      <th>Category</th>
      <th>Quantity</th>
    </tr>
  </ng-template>
  <ng-template pTemplate="body" let-product>
    <tr [ngClass]="{"row-accessories": product.category === "Accessories"}">
      <td>{ { product.code } }</td>
      <td>{ { product.name } }</td>
      <td>{ { product.category } }</td>
      <td>
        <div [ngClass]="{"outofstock": product.quantity === 0, "lowstock": (product.quantity > 0 && product.quantity < 10),"instock": product.quantity > 10}">
          { { product.quantity } }
        </div>
      </td>
    </tr>
  </ng-template>
</p-table>