CODEWITHSUNDEEP
angularprimengprimeng-turbotable
Jared Whipple
Jared Whipple

Reputation: 1171

Get index with PrimNG TurboTable and Angular 6

I cant figure out how to get an index with Angular 6 and PrimeNG turbo table.

this is my best guess on how it should work. 

<p-table [value]="timecards">
  <ng-template pTemplate="body" let-timecard let-i="index">
    <tr><td>{{ i }}</td><td>{{ timecard.value }}</td></tr>
  </ng-template>
</p-table>

But I have also tried this

<p-table>
  <ng-template pTemplate="body" ngFor let-timecard let-i="index" [ngForOf]="timecards>
    <tr><td>{{ i }}</td><td>{{ timecard.value }}</td></tr>
  </ng-template>
</p-table>

And this

<p-table [value]="timecards">
  <ng-template pTemplate="body" ngFor let-timecard let-i="index" [ngForOf]="timecards>
    <tr><td>{{ i }}</td><td>{{ timecard.value }}</td></tr>
  </ng-template>
</p-table>

And several other combinations. I can't get any of them to work.

Upvotes: 6

Views: 7556

Answers (2)

senthamizhmani
senthamizhmani

Reputation: 1

 <p-table [value]="editAttachementFileLink" [tableStyle]="{ 'min-width': '100rem' }">
                                        <ng-template pTemplate="header">
                                            <tr>
                                                <th>{{'FILE_NAME' | translate}}</th>
                                                <th>{{'REMOVE' | translate}}</th>
                                            </tr>
                                        </ng-template>
                                        <ng-template pTemplate="body" let-files let-rowIndex="rowIndex">
                                            <tr>
                                                <td *ngIf="files.isLink"><a [href]="files.linkDetails" target="_blank"
                                                        (click)="privateFiles(files.linkDetails)">{{files.fileName}}</a>
                                                </td>
                                                <td *ngIf="!files.isLink"><a
                                                        (click)="privateFiles(files.fileDetails)">{{files.fileName}}</a>
                                                </td>

                                                <td class="remove-column">
                                                    <span (click)="removeAttachment(rowIndex)"
                                                        style="cursor: pointer; font-size: 14px;"><i
                                                            class="pi pi-times-circle"></i></span>
                                                </td>
                                            </tr>
                                            <!-- <ng-template pTemplate="body" *ngIf="!fileNames|| (fileNames?.length==0)">
                                                <tr  colspan="3">{{'NO_RECORDS_FOUND' | translate}}</tr>
                                            </ng-template> -->

                                        </ng-template>
                                    </p-table>

Upvotes: 0

Gordon Westerman
Gordon Westerman

Reputation: 1115

The property you are looking for is let-rowIndex as described by the PrimeNG TurboTable documentation:

<p-table [value]="timecards">
  <ng-template pTemplate="body" let-timecard let-rowIndex="rowIndex">
    <tr><td>{{ rowIndex }}</td><td>{{ timecard.value }}</td></tr>
  </ng-template>
</p-table>

Upvotes: 18

Related Questions