angularprimengprimeng-datatablep-table

how to set index variable in primeng p-table like in ngFor


Can any one assist me. I want to initialize index variable like *ngFor="let d of sI.detail;let i=index"

In my p-table

<ng-template pTemplate="body" let-rowData >
      <tr class="text-center info">
        <td>{{ totalHeader }} </td>
        <td>
          <span>
            {{ rowData?.totalUnits }}
          </span>
          <span>
            ({{ rowData?.totalSale }})
          </span>
          <span *ngIf="rowData.totalUnits && rowData.totalSale">
            /{{ (rowData.totalUnits/rowData.totalSale) | percent:'1.2-2' }}
          </span>
        </td>
      </tr>
    </ng-template>```

Solution

  • You can use let-rowIndex="rowIndex" property in your table. This will give you index of the row.

    <ng-template pTemplate="body" let-rowData let-rowIndex="rowIndex">
          <tr class="text-center info">
            <td>{{ totalHeader }} </td>
            <td>
              <span>
                {{ rowData?.totalUnits }} {{rowIndex + 1}} // here is value to use
              </span>
              <span>
                ({{ rowData?.totalSale }})
              </span>
              <span *ngIf="rowData.totalUnits && rowData.totalSale">
                /{{ (rowData.totalUnits/rowData.totalSale) | percent:'1.2-2' }}
              </span>
            </td>
          </tr>
        </ng-template>
    

    Hope this help!