The Modal Controller is being created but is shown when the route changes

The Modal Controller is being created but is shown when the route changes.I don’t understand what’s going on but today when trying to open ModalController the modal is created but not displayed on the screen. It started showing when I changed the route.

 async openModal() {
    const modal_ = await this.modalCtrl.create({
      component: ApplicationDetailPage,
      cssClass: '',
      backdropDismiss: false,
      componentProps: {
        config: this.config
      }
    });
    return await modal_.present();
  }
package.json
"@angular-devkit/schematics": "^13.1.4",
    "@angular/common": "~12.0.1",
    "@angular/core": "~12.0.1",
    "@angular/forms": "~12.0.1",
    "@angular/platform-browser": "~12.0.1",
    "@angular/platform-browser-dynamic": "~12.0.1",
    "@angular/router": "~12.0.1",
    "@awesome-cordova-plugins/barcode-scanner": "^5.38.0",
    "@awesome-cordova-plugins/core": "^5.37.1",
    "@awesome-cordova-plugins/firebase-x": "^5.37.3",
    "@capacitor-community/barcode-scanner": "^2.0.1",
    "@capacitor/android": "^3.4.0",
    "@capacitor/app": "1.1.0",
    "@capacitor/browser": "^1.0.7",
    "@capacitor/core": "3.4.0",
    "@capacitor/haptics": "1.1.4",
    "@capacitor/ios": "3.4.0",
    "@capacitor/keyboard": "^1.2.1",
    "@capacitor/status-bar": "1.0.7",
    "@ethersproject/contracts": "^5.5.0",
    "@ethersproject/providers": "^5.5.2",
    "@ionic-native/app-availability": "^5.36.0",
    "@ionic-native/barcode-scanner": "^5.36.0",
    "@ionic-native/camera": "^4.20.0",
    "@ionic-native/core": "^5.36.0",
    "@ionic-native/fcm": "^5.36.0",
    "@ionic-native/in-app-browser": "^5.36.0",
    "@ionic/angular": "^6.0.3",
    "@ngx-translate/core": "^13.0.0",
    "@ngx-translate/http-loader": "^6.0.0",
    "apexcharts": "^3.33.0",
    "assert": "^2.0.0",
    "buffer": "^6.0.3",
    "cordova-browser": "6.0.0",
    "cordova-plugin-firebasex": "^13.0.1",
    "cordova-plugin-inappbrowser": "^5.0.0",
    "ios-deploy": "^1.11.4",
    "moment": "^2.29.1",
    "native": "0.3.3",
    "ng-apexcharts": "^1.6.0",
    "ngx-swiper-wrapper": "^10.0.0",
    "paraswap-core": "^1.0.2",
    "process": "^0.11.10",
    "rxjs": "~6.6.0",
    "stream-browserify": "^3.0.0",
    "swiper": "^7.4.1",
    "tslib": "^2.0.0",
    "webpack": "^4.46.0",
    "zone.js": "~0.11.4"

I think it’s related to dependencies, as I’ve been running into such a problem out of the blue. If different dependencies are needed to solve the problem, I can share them as well.

Problem is solved. Previously, when using ion-tabs, ion-app was used as the parent, but I removed the ion-apps part. That’s why Controllers don’t work well. Problem solved, don’t forget to use it inside ion-app when using ion-tabs!