Ionic navbar dropdown-menu

Ionic Framework Ionic Angular
1

Wanted to create dropdown menu similar to the picture mentioned.Can anyone please help me regarding this.Clicking on icon must display the dropdown.Usage angular ionic4. dropdown .

2

Have you tried ion-popover?


import { Component } from '@angular/core';
import { PopoverController } from '@ionic/angular';
import { PopoverComponent } from '../../component/popover/popover.component';

@Component({
  selector: 'popover-example',
  templateUrl: 'popover-example.html',
  styleUrls: ['./popover-example.css']
})
export class PopoverExample {
  constructor(public popoverController: PopoverController) {}

  async presentPopover(ev: any) {
    const popover = await this.popoverController.create({
      component: PopoverComponent,
      event: ev,
      translucent: true
    });
    return await popover.present();
  }
}

To link to the “…” button:

In order to position the popover relative to the element clicked, a click event needs to be passed into the options of the the present method.

3

Hey Hi…I did… Thank you . Can u pls tell me how to remove the arrow in dropdown dropdown1

4

You can try to check the HTML element of the arrow and see which class it is using. Then you can copy the values and overwrite the class in /theme/variables.scss with a new value visibility: hidden; inside the class.

6

Do u have any source code related to this dropdown .It is not working has expected,Facing issues

7

Tell us more about the issues and if possible, provide related code.