Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Preserve query parameters on back button navigation

See original GitHub issue

Bug Report

Ionic version:

[x] 4.x

Current behavior:

Query parameters are not preserved when using back button.

Expected behavior:

Preserve any queryParams.

Steps to reproduce:

Two pages, One starts with an queryParam. Navigate to second page. Use ion-back-button to go back The queryParam is gone.

Related code:

─────────────────────────────────────────────────────────────────────────────────────────────────────────
 --- a/angular/src/directives/navigation/stack-utils.ts
 +++ b/angular/src/directives/navigation/stack-utils.ts
──────────────────────────────────────────────────────────────────────────────────────────────────────────
@@ -38,7 +38,7 @@ function setBack(views: RouteView[], view: RouteView) {
 }
 
 export function getUrl(router: Router, activatedRoute: ActivatedRoute) {
   const urlTree = router.createUrlTree(['.'], { relativeTo: activatedRoute });
   const urlTree = router.createUrlTree(['.'], { relativeTo: activatedRoute, queryParams: activatedRoute.snapshot.queryParams });
   return router.serializeUrl(urlTree);
 }

Other information:

Ionic info:

Ionic:

   ionic (Ionic CLI)             : 4.3.0
   Ionic Framework               : @ionic/angular 4.0.0-beta.18
   @angular-devkit/build-angular : 0.10.6
   @angular-devkit/schematics    : 7.0.6
   @angular/cli                  : 7.0.6
   @ionic/angular-toolkit        : 1.2.0

Cordova:

   cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
   Cordova Platforms     : android 7.1.4
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 2.2.5, (and 12 other plugins)

Issue Analytics

State:
Created 5 years ago
Reactions:7
Comments:12 (6 by maintainers)

Top GitHub Comments

3reactions

daem0ndevcommented, Apr 17, 2019

@liamdebeasi I can confirm this is a completely different issue from the fixes we introduced in 4.2. I am working on a PR for this one will update this thread when ready.

Also slightly related but different issue that could potentially be resolved once this issue is resolved: https://github.com/ionic-team/ionic/issues/15428

cc @mhartington

3reactions

trakhimenokcommented, Jan 27, 2019

This is a serious blocker.

/members?commune=abc =>navForward=> /member?id=123 =>click back button=> /members — we’ve lost commune ID parameter

We’ve decided to use query URL parameters in PWA for a number of reasons (analytics, filters, etc.) and this bug breaks navigation.

Reproducible in 4.0.0 release.

CC @manucorporat as I see you are working on back button navigation & overlays.

Top Results From Across the Web

What is a proper way to preserve parameters after ...

In my Angular app, I have list and details pages and I want to lkeep the pageIndex value before navigating to details page....

Query params causing problem with Back Button?

So to correct the problem, I gave A and B private instances of the service, then added a singleton data service (shared by...

A Neat Trick to Globally Preserve Query Params in Angular ...

It is based on simple axioms of web navigation. At the moment there is no way to preserve query params globally on all...

Router tutorial: tour of heroes

When the user clicks the back button, the HeroDetailComponent constructs another link parameters array which it uses to navigate back to the HeroListComponent...

Angular URL State management with Query Params or ...

selections in URL. When user goes to another page by clicking on URL and then later come back to the old page by...