Wie tief verschachtelte Array Javascript Eckige zu bekommen?

Wie erhalte ich dieses Array und zeigen Produktnamen? Das ist mein verschachtelter Objekt-Array. Bild Schauen Sie ich weiß nicht, wie product.name in meiner Antwort zu teilen. Habe ich mit ngFor tun oder ich muss innerhalb ts-Datei filtern?

https://imge.to/i/vkq8eH

Schauen Sie meinen Code:

  getProducts() {
    this.product.getLastPurchase().subscribe((data: any) => {
     this.lastPurchase = data;
     this.lastProduct = data.items;
     this.productName = data.items;
    //  this.onlyProduct = data.items;
     this.productName.map(e => this.nameOfProductForShare = e.product);
    //  this.nameOfProductForShare.map(e => console.log(E , e));
    this.productName.forEach(element => {
      console.log(this.onlyProduct =  element.product.name)
    });
    });
  }

Vorlage:

    <div  *ngFor=let item of lastPurchase.items>
      <div   >
      <div class=row>
        <span>Proizvod: </span>
      </div>
      <div>
        <div class=row>
            <mat-form-field class=example-full-width style=display:none>
                <input
                 matInput
                 placeholder=Proizvod
                 name=id
                 [(ngModel)]=item.id
                 >
              </mat-form-field>
              <mat-form-field class=example-full-width>
                  <input
                   matInput
                   placeholder=Proizvod
                   name=item.name
                   [(ngModel)]=item.product.name
                   >
                </mat-form-field>
        </div>
        <div class=row>
          <mat-form-field class=example-full-width>
            <input
             placeholder=kg/kom/pak
             name=quantity
             [(ngModel)]=item.quantity
             >
          </mat-form-field>
        </div>
      </div>
      <div class=row>
        <hr class=style-hr-custom>
      </div>
    </div>
  </div>