Maintain state of Search page after navigating back from details page in Angular Material table using Akita/State management

Question

I am looking for any working example where I can save the search filter state,pagination state after a click on the detail page and coming back to using the location.back() function.

I am using the Akita store and angular material table in my application to maintain the state.

I was going through one of the AkitaFilter plugins but they are lacking documentation and examples. Can anyone have a solution using any NGRX or Akita State management to save the state in the angular material table?

Answer 1

you can store your current state of table in your localstorage like this in each filter's function you can do

localStorage.setItem('state', JSON.stringify(this.store.getState()));

Alternatively you can store your grid/table's filter state in your localstorage , Like you can store currentPage, sortOrdet etc in your localstorage. Because if you want your data to be persistent even after navigation or page refresh so you can store in localstorage because state management stores are also services based architecture in which data can't be persistent.

You can do this in a way that inside your pagination button function you can store your current page in your localstorage each time your function will be called. And same goes for sorting function.