Back Button Not Closing Modal in Ionic 7 + Angular 17 + Capacitor 5

Ionic Framework
1

I’m using Ionic 7.5.1, Angular 17, and Capacitor 5.

I have a modal opened using ModalController.create(), and I want the Android hardware back button (or gesture) to close the modal, instead of minimizing the app or sending it to the background.

What I tried so far:

  • platform.backButton.subscribeWithPriority(...) → does nothing when modal is open.
  • history.pushState + popstate listener → only works in browser, not on actual Android devices.
  • @HostListener('window:popstate', ['$event']) → same result: works in browser, not on mobile.

Goal:
When a modal is open and the user presses the back button, the modal should close. If no modal is open, the app should navigate one step back.
Right now, when I press the back button with a modal open – the app just minimizes or goes to background instead of closing the modal.

Has anyone solved this for newer versions of Ionic? Would love a working solution that applies to current versions (Ionic 7 / Capacitor 5 / Angular 17).

Thanks in advance!

2

From what I understand the back button is navigation and modals are not pages in the navigation. You could try hijacking the back button function via a function.