ionic4 popovercontorller 简单用例

在我们用ionic 4 进行app  的开发需要使用类似以下的 功能：

  

 

我们在点击事件时 加载的是页面   

    <ion-button (click)="presentPopover($event)">
        <ion-icon slot="icon-only" name="more"></ion-icon>
      </ion-button>

在ts文件的  presentPopover()  的内容如下：

需要导入   PopoverController  模块 

import { PopoverController } from '@ionic/angular';

constructor(public popoverCtrl: PopoverController) { }
async presentPopover(event: Event) {
    const popover = await this.popoverCtrl.create({
      component: PopoverPage,
      event
    
    });

   return await popover.present();

 这里的  PopovePage  就是你要加载过来的页面 内容如下：

import { PopoverController } from '@ionic/angul