Ionic-5 app is closing instead back to previous page on click of hardware back button

Question

I am using angular 7 and ionic 5. When i want to redirect to previous page using hardware back button, ionic app is closing itself. I am using below code but its not working.
 this.platform.backButton.subscribeWithPriority(9999, () => {
        document.addEventListener('backbutton', function (event) {
          event.preventDefault();
          event.stopPropagation();
          console.log('hello');
        }, false);
      });

pl-jay · Answer

Try this,
 this.platform.backButton.subscribeWithPriority(10, () => {
      this.router.navigate(['']); // route to previous page or component
 });

Andran · Answer

I use the directive for this

import { Directive, HostListener } from '@angular/core';
import { PlatformService } from 'src/app/services/platform';

@Directive({
    selector: '[disableBackButton]'
})
export class DisableBackButtonDirective {

    constructor(
        private platformService: PlatformService
    ) { }

    @HostListener('document:ionBackButton', ['$event'])
    overrideHardwareBackAction(event: any) {
        if (this.platformService.isPlatform('android')) {
            event.detail.register(100, async () => {
                event.stopImmediatePropagation();
                event.stopPropagation();
                event.preventDefault();
            });
        }
    }
}

in page.html

<ion-content disableBackButton>
    ....
</ion-content>

in page.ts

this.platform.backButton.subscribe(() => {
    console.log('hello');
});

Ionic-5 app is closing instead back to previous page on click of hardware back button

2 Answers

Add your own answers!

Ask a Question