[Ionic 4 - Solved] Returning to previous page loses scroll position

Ionic Framework
1

Here is my HTML list:

<ion-list>
  <ion-item *ngFor="let item of items">
    <button ion-item (click)="openItem(item)">
    [...]
    </button>
  </ion-item>
</ion-list>

The openItem method in the .ts file of the list:

openItem() {
// this.navCtrl.navigateForward('/detail');
this.router.navigateByUrl('/detail')
}

And the HTML of the detail page for returning back. I noticed that in the previous version the ion-back-button was not needed when pushing a page, but in this version I needed this tag:

<ion-header>
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-back-button defaultHref="/home"></ion-back-button>
    </ion-buttons>
    <ion-title>detail</ion-title>
  </ion-toolbar>
</ion-header>

I tried both methods, with the navCtrl and the router, after going to the detail page and returning back to the list I lose the scroll position in the list. I’ve tested the “ionic super” project from the past version and it works as expected, but for now there is no “ionic super” for v4 so I replicated the list with detail views from past version and this is the result:

pOTwJ.gif600Ă—566

Is anybody experiencing the same problem?

I populate the list inside the constructor of the .ts list, and it is called only once, so it doesn’t seem like a data reload problem (I took it from the Ionic sidemenu example v4).
My version of @ionic/angular is the lastest 4.0.0-beta.7

2

No idea?
I’ve found an regarding this:


I decided trying to get the current scroll for setting it when returning, as explained in the comments section from the issue, soI tried to implement the ViewportScroller solution with no success too. I’ve tried this also.
I can set the scroll position but I can’t get the current scroll of the <ion-list>, anybody knows how to get the scroll position in Ionic 4? Thanks in advance.

3

My current workaround for this:


1 Like