如何在 ionic 3 中创建下拉组件

Question

首先让我说我是 ionic 新手，我尝试在 Google 中找到我的解决方案，但现在信息与 ionic 1、ionic 2 和现在的“ionic 3”混合在一起。

我需要做一个下拉菜单，我称之为“创建方法”，带有参数，这个方法绘制带有选项的菜单。

我测试了不同的方法，首先尝试修改弹出窗口，然后是模态框，但我无法解决我的问题。

我需要知道这样做的最佳形式，我认为我应该制作外部组件并使用他的方法来做我想做的事。到目前为止，我使用的是 Sencha Touch，我使用此代码：

    Ext.create("Amix.view.general.Menu",{
        options : options,
        callback : callback
    });

    Ext.define('Amix.view.general.Menu',{
        extend: 'Ext.panel',

        ...

        listeners: {
                
            initialize: function(){
              
               Ext.Viewport.add(this);
             
               ...

这就是我想要的：

另外，选择 DOM 项目的最佳形式是什么？在 sencha 中，我使用 Ext.getCmp() 或 Ext.select()，在 jQuery 上使用 $()，在 JavaScript 上使用 document.queryselector。

Answer 1

根据您的屏幕截图，您需要 ionic Popover。对于 Ionic 2.x 和 3.x 有内置组件由 ionic Popover

您可以使用它简单地导入您的页面

import { PopoverController } from 'ionic-angular';

@Component({})
class MyPage {
  constructor(public popoverCtrl: PopoverController) {}

  presentPopover(myEvent) {
    let popover = this.popoverCtrl.create(PopoverPage);
    popover.present({
      ev: myEvent
    });
  }
}

查看演示here