Nested Routing and ClearHistory: Error when route between nested routes

[codeback]

I have two routes which have child routes:

• Route A

  • Nested Route A1
  • Nested Route A2

• Route B

  • Nested Route B1
  • Nested Route B2

If I navigate from 'Nested Route A2' to 'Nested Route B1' with clearHistory=true, then I can not navigate anymore between 'Nested Route B1' and 'Nested Route B2'.

This repo reproduces the issue. Steps to reproduce it:

1. Navigate to 'Angular routing' -> 'Nested routers'
2. Click on 'SECOND' button,
3. Click in the big button 'This is second. Load first',
4. Now, you are in the 'Angular Routing 2' component, but you can't navigate between the nested routes.

Please see this animation:

The repo is using:

• "nativescript-angular": "next",
• "tns-core-modules": "next",

The problem occurs in both platforms (iOS an Android).

P.D. I know that there are several issues regarding clearHistory but I think this case is not reported. Sorry if I am wrong.

[sean-perkins]

Also have this issue with the latest.

EDIT:

Running the navigate through a zone resolves the issue for us.

[codeback]

Hi @sean-perkins,

Do you mean something like the following?

this._zone.run(() => this._routerext.navigate(['/home/view-1'], {clearHistory: true}));

It doesn't work in my case :(

@vakrilov, @tsonevn have you been able to reproduce this issue? Is it related with the new route-reuse strategy?

[vakrilov]

Hi @codeback - I managed to reproduce the issue with your project.
What's interesting is that there are no exceptions thrown and navigation to another page still works. Navigation onside the nested router is not working.

@sean-perkins - Can you please share more detail on you solution using the zone. It might lead to some insights on the problem and eventually help solve it :)

[sean-perkins]

In our scenario, the problem only presented itself after upgrading the Angular and NS Angular dependencies to the latest. We were on ~3.1.3 (NS Angular) beforehand. We have a lazy-loaded module that navigates the user to another lazy-loaded module, inside an event listener on a WebView.

With no changes (only dependency upgrades and updating to NativeScriptCommonModule), the app would redirect to the lazy-loaded module and no change detection or life cycle events would occur. But, after swiping out a side drawer and tapping an action, the page would then load all the life cycle hooks.

If we logged out of our application (which sends us back to the original lazy-loaded module) and log back in, change detection occurs, but then all navigation events are broken. Active router links are set, but the page-router-outlet doesn't actually update the component rendered.

To solve this, we wrapped our initial navigate inside a zone.run, which fixed the problem globally. We haven't dug into it any further, as there are no logs and that makes it unproductive to debug.

[nikoTM]

Almost the same scenario, except running inside zone does not work for me. Had to remove clearHistory temporarily until this gets resolved.

[codeback]

In my case, remove clearHistory produces other undesirable side effects. And running inside zone does not work either. :(

In my app the problem is that the ending route is a nested route. In other words, clearHistory=true doesn't work if the destination route is a nested route.

My very ugly workaround is to put another route in the middle: From Route A, navigate to Route C with clearHistory=true and then, from Route C, navigate to the destination nested Route with clearHistory=true.

Hope it helps while the issue gets resolved.

[HassanMoinn]

Similiar issue I am having, for the past week trying to fix it but Alas !
I am using clearHistory = true when the person starts the app again after previously logged in, so to by-pass the login screen.
When clearHistory = true, i go to a parent route, which has children routes, these children routes are then used to navigate to different views in the same parent route using

this.router.navigate(['appointments'], {relativeTo : this.route});

but when clearHistory = true, nothing happens just like OP mentioned above.

At first I thought that the routes break, but the console does not throw any error for routes break.

P.S: without clearHistory apps behaves the way it should

[simonpietsch]

Not sure if this helps to isolate the exact issue, but I've narrowed the cause of this problem to when the NSRouteReuseStrategy clears out its state cache - specifically when the cached items are destroyed.

If the destroyComponentRef call within DetachedStateCache.clear is skipped, then child routing continues to work.

[llwt]

Removing the destroyComponentRef call works for us as well. That seems like something that would create a memory leak though right?