Table of Contents

Example of making a custom popover

  1. Go to (IMAB) Pages page and create a page with the name My Menu. On the Page Header tab then select the Layout Type option Without Header and write menu codes on Page Content (HTML5)
      <ion-list>
    	<ion-list-header>Ionic</ion-list-header>
    	<ion-item button>Learn Ionic</ion-item>
    	<ion-item button>Documentation</ion-item>
    	<ion-item button>Showcase</ion-item>
    	<ion-item button>GitHub Repo</ion-item>
      </ion-list>

  2. and go to the page where the popover button will be placed and write popover button code on Page Content (HTML5) field
    <ion-button (click)="openPopover()" >Open Popover</ion-button>
    and function on Other Functions (TypeScript) field
    async openPopover(ev: any) {
        const popover = await this.popoverController.create({
          component: MyMenuPage,
        });
        await popover.present();
     }
    and import My Menu page

Last edit: 2021-09-16 01:53:31

Comment

For any question about products, please contact email support is: info@ihsana.com and info@ihsana.net

Search

img