ionic 4 模态控制器对话框不起作用

Question

我使用 for Ionic 4 的模态控制器对话框从另一个页面获取参数。我以正确的方式编码，当我点击按钮启动模态控制器时，他没有显示。即使我在声明和入口组件中添加了模型页面，但不幸的是同样的问题

您可以在图像控制台日志中看到他从另一个已经没有执行按钮的情况下获取数据参数。他看起来像现在的模态控制器自动。

模态控制器代码

 async addWeather(){

    const AddWeatherModal = await this.modalController.create({
      component: AddPagePage,

    });
    await AddWeatherModal.present()
    await  AddWeatherModal.onDidDismiss().then((r) => {

          if(r.data.result){
            this.getWeather(r.data.result)
             console.log(r)
          }else if (r.data.result ==""){
            this.AlertNotSelected()

            console.log("No Data . ")
          }


    });

  }

html

<ion-header>

  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-menu-button autoHide="true"></ion-menu-button>

    </ion-buttons>
    <ion-buttons slot="primary">
      <ion-button (click)="addWeather()">
        <ion-icon slot="icon-only" name="search"></ion-icon>
      </ion-button>
    </ion-buttons>
    <ion-title text-center>محطات الرصد الجوي</ion-title>
  </ion-toolbar>



</ion-header>

<ion-content >

</ion-content>

有什么帮助吗？

Answer 1

我认为这应该有效：

const AddWeatherModal = this.modalController.create({
      component: AddPagePage,

    });
AddWeatherModal.then((modal) => modal.present());

Answer 2

我发现了问题，问题出在 global scss

大多数是在全局 scss 中添加这一行

.modal {
display: flex !important;
}

bootstrap4 的样式定义了模态class，默认显示为none。现在他工作得很好。

ionic 4 模态控制器对话框不起作用

ionic 4 modal controller dialog doesn't work

angular

ionic4

modalviewcontroller