Keep Angular Material table state after Component redirection

Question

I have a TableComponent with an Angular Material table that contains some links to other components.

When I am on the second page of the table (Image above) and I click on the link, routerLink redirects to DetailComponent. Once I am redirected, if I press the back button or I execute location.back() I go back to TableComponent, but the table is located on the first page, instead of the one I was before.

Is there a way to keep the previous state of the table, after redirections between components?

Thanks in advance!

I don't know why this question was downvoted. This is what I was looking for. — ReturnTable, Sep 23 '19 at 15:18

score 3 · Accepted Answer · answered Jul 31 '19 at 08:45

When you're redirecting between components, their content is destroyed, so there is no way for a destroyed component to remember anything ;) But you can store the information about the page index somewhere else in the application (service or store if you're using Redux).

So you can save the page index before redirection i.e. using service or even better just update service after every page change.

Then you can get the index and use pageIndex property of MatPaginator as described in documentation: https://material.angular.io/components/paginator/api to set correct page index after getting back to this page. Let me know if you need any more help with that.

Thanks Patryk, that's what I needed to know! – Iñigo Jul 31 '19 at 08:47 — Iñigo, Jul 31 '19 at 08:47

Keep Angular Material table state after Component redirection

1 Answers1