I'm attempting to iterate through an array where each object represents a table in HTML, and it should be displayed like this:
<p-table [value]="section" *ngFor="let section of sections">
<ng-template pTemplate="header">
<tr>
<th>Quantity</th>
<th>Length</th>
<th>m^2</th>
<th></th>
</tr>
<tr>
<th colspan="4">
<div (click)="showDialog()" class="text-left">+ A - Flat Panel RAW MDF Red Gloss
- $95 / sqm
</div>
</th>
<th colspan="8">
<div class="md-inputfield">
<input type="text" class="form-control" pInputText>
</div>
</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-rowData *ngFor="let piece of rowData.Pieces">
<tr>
<td>
<p-spinner [(ngModel)]="rowData.Quantity"></p-spinner>
</td>
<td pEditableColumn>
<p-cellEditor>
<ng-template pTemplate="input">
<input type="text" [(ngModel)]="rowData.Length">
</ng-template>
<ng-template pTemplate="output">
{{rowData.Length}}
</ng-template>
</p-cellEditor>
</td>
<td>
{{CalculateTotalArea(rowData)}}
</td>
<td>
<button pButton type="button" icon="fa-close"></button>
</td>
</tr>
</ng-template>
</p-table>
However, I encounter an error
this.value.sort is not a functionthis.pieces = [{
Quantity: 2, Length: 3, Width: 3, Thickness: 4
}]this.sections = [
{ Pieces: this.pieces, text: "abc" }
]I'm trying to upload this code to Plunker, but I'm unsure how to update the version of primeng to "primeng": "^5.2.0-rc.1", which is causing issues with the current Plunker setup. Can someone help me update the primeng library and provide suggestions on resolving this bug?
Here is the Plunker link: Plunker