Ionic-framework: bug: Issues with ion-router-outlet and router-outlet

[tlaverdure]

Bug Report

Ionic version:


[x] 4.x

Current behavior:

Navigation stops working when navigating from a tab to pages that use router-outlet.

Navigate to Tab1 > Page1 (contains router-outlet) > Page2 (contains router-outlet) and then go back to Page1 and try to switch the tab. Navigation seems to stop working at that point. It appears the tabs are tying to use a nested router-outlet instead of the outlet at the root.

Expected behavior:

Deep navigation to pages from tabs that use router-outlet without navigation failing.

Related Code
Here is a repo of the issues using ion-router-outlet and router-outlet
https://github.com/tlaverdure/ion-router-outlet-test

Ionic info:

Ionic:

   Ionic CLI                     : 5.2.2 (/usr/local/lib/node_modules/ionic)
   Ionic Framework               : @ionic/angular 4.6.2
   @angular-devkit/build-angular : 0.13.9
   @angular-devkit/schematics    : 7.3.9
   @angular/cli                  : 7.3.9
   @ionic/angular-toolkit        : 1.5.1

Utility:

   cordova-res : not installed
   native-run  : not installed


System:

   NodeJS : v12.1.0 (/usr/local/bin/node)
   npm    : 6.9.0
   OS     : macOS Mojave

[tlaverdure]

It's also worth noting that there is a conflict when using both ion-router-outlet and router-outlet.

When switching away from a tab that contains a router-outlet and then coming back to the tab, the child routes get cleared and the url reverts to the parent route path.

[tlaverdure]

I found another issue.

Tab1 > Page 1 > Page 3 (contains router-outlet) > Back to Page 1 (navigation is broken at this point)

Here is a repo: https://github.com/tlaverdure/ion-router-outlet-test

[tlaverdure]

I at first was going to submit a feature request, but the more I tried to work around this issue the more it appear to be a bug.

Could be related to: https://github.com/ionic-team/ionic/issues/18197

[liamdebeasi]

Thanks for the issue! I was able to reproduce this. Also wanted to link a similar issue with a reproduction: https://github.com/johanvdb/ionic-4-router-issue

[tlaverdure]

You're welcome! Let me know if you need any additional info.

[DmitryEfimenko]

any progress on this issue?

[Proper-Job]

I was going to create a bug report for this as well, but it seems there are ample reports for this problem. I can confirm that the issue @tlaverdure describes here is present in @ionic/angular 5.1.1 and @ionic/angular 4.11.10.