How to configure Paginator and Sort in a table in SSD?

[LavanyaS]

Hi Team,

I am trying to incorporate pagination and sort in a table in SSD.

Below is my configuration:

Is there any other configuration that I missed, can you please help me regarding this?

Thanks,
Lavanya S

[VAjith]

Hi Lavanya,

Please try regenerating the Table flow first, followed by the Paginator flow by clicking the icon next to the header (as shown in the screenshot below).

Once both flows are regenerated, you can configure them as per your requirements.

Let me know if you face any issues after trying this.

[LavanyaS]

Hi @VAjith,

I tried as per your suggestion, but I am getting the same error. It created the flow like this.

First view picker and script for MatSort, second one is for MatPaginator with same code.

[LavanyaS]

Hi Team,

Also, I noticed that the paginator and sort is working fine, when I use static data as datasource for the table.

But it is not working, when I do a service call to fetch the data onInit.

I am getting the error even before the service call in the console logs.

Can you please help?

Thanks,
Lavanya S

[VAjith]

Hi Lavanya,

Could you please share the code where you’re setting the table data?

Thanks,
Ajith

[LavanyaS]

Hi @VAjith,
This is my flow. I am doing a service call to fetch the book list and set it in page variable.

Thanks,
Lavanya

[Sam]

Hello @LavanyaS ,Just checking in—has your issue been resolved? If not, could you please share the repository link with us via personal chat so we can take a closer look from our side?

[LavanyaS]

Hi Sam,
Yes, the solution provided by VAjith is working. I had to configure the MatSort and MatPaginator in ngOnInit rather than ngAfterViewInit.

Thank you @VAjith

Regards,
Lavanya