Content Scroll to point is automaticaly reset to top


I’m trying to use an actionsheet to scroll to a point inside a content but every time it is scrolling to the point, the scroll is instantly reset to the top.

Basically, I generate different block with ngfor, then set an ID for each block. I, then, get the element position and use the content scrollToPoint function.

I enabled the scroll event on the ion-content with : <ion-content [scrollEvents]="true" [scrollX]="true" [scrollY]="true">

I enabled anchorscrolling in my app routing module : RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules, anchorScrolling: 'enabled' })

<ion-button size="small" (click)="openAC(t)">
       <ion-icon slot="icon-only" class="icon-item-slide" name="list-outline"></ion-icon>

<div id="{{}}" class="type-event" *ngFor="let type of">
@ViewChild(IonContent, {static: false}) content: IonContent;

async openAC(t) {

    let ac_options = {
      buttons: [{
        text: 'cancel',
        icon: '',
        role: 'cancel',
        handler: () => {
          console.log('Cancel clicked');
    } Type) => {
        icon: '',
        handler: () => {
          var anchor = document.getElementById(;
          this.content.scrollToPoint(anchor.x, anchor.y);

Any idea ?


The problem was with the actionsheet.
Actionsheet, on dismiss has a scroll event that go to top.
So, I waited for it to dismiss to launch my scroll to point event.

actionSheet.onDidDismiss().then(({role}) => {
      let anchor = document.getElementById(role).getBoundingClientRect();
      setTimeout(() => {
        this.content.scrollToPoint(anchor.x, anchor.y - 100, 150);
      }, 250)