bug: Ionic Angular Router Link Prop Reload the Whole Page During Navigation

Prerequisites

• I have read the Contributing Guidelines.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already report this problem, without success.

Ionic Framework Version

• v4.x
• v5.x
• v6.x

Current Behavior

When the component ion-card, ion-item, or ion-button has a routerLink prop is clicked, it gonna navigates to the desired page but also reloads the whole page unlike when we do navigation via this.router.navigateByUrl, this means we lost the application state for every navigation.

Expected Behavior

When the component ion-card, ion-item, or ion-button has a routerLink prop is clicked, it is supposed to navigate to the desired page but without reloading the whole page, so that the application state is still the same as when we do navigation via this.router.navigateByUrl.

Steps to Reproduce

• Clone the project from provided code reproduction URL below, then serve the project on the web.
• Click the ion-card, ion-item, and ion-button with Go to Dashboard via Router Link text to see the current behavior.
• Click the ion-card, ion-item, and ion-button with Go to Dashboard via Navigate by Url text to see the expected behavior.

Code Reproduction URL

https://github.com/yoelpc4/router-link-issue

Ionic Info

Ionic:

   Ionic CLI                     : 6.19.0 (/Users/yoelpc4/.nvm/versions/node/v16.14.2/lib/node_modules/@ionic/cli)
   Ionic Framework               : @ionic/angular 6.0.15
   @angular-devkit/build-angular : 13.2.6
   @angular-devkit/schematics    : 13.2.6
   @angular/cli                  : 13.2.6
   @ionic/angular-toolkit        : 6.1.0

Capacitor:

   Capacitor CLI      : 3.4.3
   @capacitor/android : not installed
   @capacitor/core    : 3.4.3
   @capacitor/ios     : not installed

Utility:

   cordova-res : 0.15.4
   native-run  : 1.5.0

System:

   NodeJS : v16.14.2 (/Users/yoelpc4/.nvm/versions/node/v16.14.2/bin/node)
   npm    : 8.5.0
   OS     : macOS Monterey

Additional Information

The reproduction is using fresh installed ionic angular via the ionic start command without any alteration to the package’s version on package.json.

I also have a current project with this ionic info as follows:

Ionic:

   Ionic CLI                     : 6.19.0 (/Users/yoelpc4/.nvm/versions/node/v16.14.2/lib/node_modules/@ionic/cli)
   Ionic Framework               : @ionic/angular 6.0.15
   @angular-devkit/build-angular : 13.3.2
   @angular-devkit/schematics    : 13.3.2
   @angular/cli                  : 13.3.2
   @ionic/angular-toolkit        : 6.1.0

Capacitor:

   Capacitor CLI      : 3.4.3
   @capacitor/android : 3.4.3
   @capacitor/core    : 3.4.3
   @capacitor/ios     : 3.4.3

Utility:

   cordova-res : 0.15.4
   native-run  : 1.5.0

System:

   NodeJS : v16.14.2 (/Users/yoelpc4/.nvm/versions/node/v16.14.2/bin/node)
   npm    : 8.5.0
   OS     : macOS Monterey

I’m also gonna test the bug fix later with my current project in case of different version still has this issue.

[yoelpc4]

OK I can confirm the hotfix release is working as intended @liamdebeasi @danielehrhardt

[ionitron-bot[bot]]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.