Angular14 Save nested component state to reuse it in another route

24 views Asked by At

I have a dashboard page in my app (/dashboard) with a DashboardComponent that uses, in its template, a nested ItemsListComponent component. I also have another route in my app (/items) that only uses the ItemsListComponent.

How do I save the state of the ItemsListComponent so that its reused in both the /dashboard and the /items pages ?

Currently, I'm using a custom RouteReuseStrategy class (see this answer) to save the state of components on selected routes. The ItemsListComponent state is successfully saved on both the /dashboard and the /items pages, but these are two different instances of the ItemsListComponent with separate states, even if both have the same key, as on the /dashboard route, the RouteReuseStrategy methods are only triggered for the DashboardComponent (that contains the ItemsListComponent).

I understand that RouteReuseStrategy only saves the states of routes and not components, so I'm not even sure that what I'm asking for is possible, but perhaps someone found a hacky way to make it work.

0

There are 0 answers