[FIXED] How can I assign id to rows dynamically in table?

Issue

I am using p-table -> https://primefaces.org/primeng/showcase/#/table/dynamic
I want to assign unique id to each row dynamically.

 <ng-template pTemplate="body" let-rowData let-columns="columns" let i="index">
    <tr id=i>
        <td *ngFor="let col of columns">
            {{rowData[col.field]}}
        </td>
    </tr>
</ng-template>

Above code doesnt assign id to the row.

Solution

You can try something like this

  <ng-template pTemplate="body"  let-rowIndex="rowIndex">
        <tr>
         <td>{{rowIndex}}</td>
        </tr>
</ng-template>

if you want to access it in your component you can use such thing

 <ng-template pTemplate="body" let-rowData let-columns="columns" let-rowIndex="rowIndex">
        <tr [pSelectableRow]="rowData" [pSelectableRowIndex]="rowIndex">
            <td *ngFor="let col of columns">
                {{rowData[col.field]}}
            </td>
        </tr>
    </ng-template>

btw in order to see more examples, you can navigate to the primeng website:
https://primefaces.org/primeng/showcase/#/table

Answered By – Hamid

Answer Checked By – David Goodson (Easybugfix Volunteer)

Leave a Reply

(*) Required, Your email will not be published