dir-paginate load all data before filtering itemPerPage

Hi guys

I’m developing an angular app that loads my list of users in a table. As quantity of users is big, I need use pagination. But there is one problem:

When I click on next page button (for example num#2) , first, table shows all users (all data load), then (itemPerPage) filter apply.

<tr dir-paginate=" x in user | filter : searchFunction | itemsPerPage : 15">
<td>{{x.id}} </td>
</tr>
<dir-pagination-controls max-size="15" direction-links="true" boundary-links="true" >
</dir-pagination-controls> 

Any suggestion will be appreciated …

[FarshadKazemi]

Hi again dear Michael , thank you so much for your answer. I finally solve this issue. The problem was in one of my CSS files. I’ve used below code for animating hover effect :

.table > tbody > tr { background: #242425; transition: background 0.5s }
.table > tbody > tr:hover { background: #e5e5e5 }

It takes 0.5s for animation of each row and when I change page, it causes some delay.

👍 👍

[michaelbromley]

Glad you got it sorted, thanks for sharing the details of the cause.