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

Question

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

您可以在Image Console日志中看到该日志，他从另一个菜单中获取了数据参数，而无需执行按钮来执行此操作。他看起来像现在的自动模态控制器。

模式控制器代码

 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

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

最应该将此行添加到全局scss中

.modal {
display: flex !important;
}

引导程序4的样式具有模式类的定义，并且默认情况下显示为none。现在他工作很好。

Answer 2

我认为这应该可行：

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

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