[IONIC 4] Tabs, scroll to the top when already in the page?


Before i was on Ionic V3 and i used this method to scroll to the page when i was already on the tab pressed and thas was perfect but now on Ionic V4 is not working anymore the “IonSelected” is not working at all.

Any idea on how i can do ?

Code :

import { IonContent } from ‘@ionic/angular’;

@ViewChild(IonContent) content: IonContent;

ionSelected() {
  this.content.scrollToTop(); // 300ms
1 Like

Create a service

export interface UrlChangeEvent {
  prevUrl: string;
  currUrl: string;
  providedIn: 'root'
export class RouterExtService {
  private urlChangeEventSubject = new Subject<UrlChangeEvent>();
  public urlChangeEvent$ = this.urlChangeEventSubject.asObservable();
    private router: Router
  ) {
      filter(e => e instanceof RoutesRecognized),
      .subscribe((event: any[]) => {
          prevUrl: event[0].urlAfterRedirects,
          currUrl: event[1].urlAfterRedirects

In your tab page

@ViewChild(IonContent, { static: false }) content: IonContent;

      .subscribe((event: UrlChangeEvent) => {
        if (event.prevUrl === event.currUrl
          && event.prevUrl === '<my tab page url>') {

hey @graemeenglish what is the this.destroyed$ ? i need to scroll to the top of the content when clicking on the tab button same as this example