Expose rowIndex as a template variable in addition to existing column and rowdata;
<p-column field="color" header="Color">
<template #col #car="rowData" #ri="rowIndex">
{{ri}}
<span [style.color]="car[col.field]">{{car[col.field]}}</span>
</template>
</p-column>
I've noticed that rowIndex
is actually an absolute row index:
((page_number - 1) * items_per_page + row_number)
It's nice but if I use lazy loaded datatable rowIndex can't help me a lot because it doesn't match item's index in component's collection.
Example:
I'm lazy loading events in datatable with 5 items limit and I want to be able to remove an event from events array by index.
events: [ {event a}, {event b}, {event c}, {event d}, {event e} ];
Clicking on 2nd row's delete button will remove events[1] element - Great!
events: [ {event f}, {event g}, {event h}, {event i}, {event j} ];
Clicking on 2nd row's delete button will remove events[6] element - but no! There is no event at position 6 :cry:
So I suggest renaming rowIndex
to absRowIndex
and adding relRowIndex
variable that will return relative row index for current datatable page.
Most helpful comment
I've noticed that
rowIndex
is actually an absolute row index:It's nice but if I use lazy loaded datatable rowIndex can't help me a lot because it doesn't match item's index in component's collection.
Example:
I'm lazy loading events in datatable with 5 items limit and I want to be able to remove an event from events array by index.
Clicking on 2nd row's delete button will remove events[1] element - Great!

Clicking on 2nd row's delete button will remove events[6] element - but no! There is no event at position 6 :cry:

So I suggest renaming
rowIndex
toabsRowIndex
and addingrelRowIndex
variable that will return relative row index for current datatable page.