Как заполнить список в списке в таблице Angular

У меня есть список значений [1, парацетамол, [{1, местоположение, количество}, {2, местоположение2, количество}] поэтому я должен печатать в две строки 1. [1, парацетамол, местонахождение, количество] 2. [2. парацетамол, местоположение1, количество2]

я сохранил голову headElements = ['Идентификатор лекарства', 'Название лекарства', 'Местоположение', 'Количество']

      <table  class = "table table-striped" >
                        <thead>
                         <tr>
                             <th *ngFor = "let head of headElements" scope = "col">{{ head }}</th>
                          </tr>
                        </thead>
                        <tbody> 
                            <div *ngFor = "let drugDetail of drugList">

                                <tr  *ngFor = "let loc of drugDetail.drugLocationList">
              
                                  <th scope = "row">{{ drugDetail.drugId }}</th>
              
                                  <td>{{ drugDetail.drugName  }}</td>
              
                                   <td>{{loc.location}}</td>
                
                                  <td>{{ loc.quantity}}</td>
                                </tr>
                              </div>
        
                      </table>

выход:

['Drug ID',                         'Drug Name', 'Location', 'Quantity']
[1, paracetamol, location, quantity]
[2. paracetamol, location1, quantity2]