代码之家 › 专栏 › 技术社区 › LarsMonty

Angular中的自定义关联菜单

contextmenu angular-material angular

LarsMonty · 技术社区 · 7 年前

我已经尝试过一个看似完美的图书馆: https://github.com/isaacplmann/ngx-contextmenu ,但它并没有像预期的那样发挥作用。

菜单只是看起来有点破损,无法使用,就像这样:

菜单附加到的元素:

<div 
    id="playhead"
    (mousedown)="movePlayheadByMouse()"
    [contextMenu]="deleteMenu"
>
     <span id="playhead-top">&#9930;</span>
     <div id="playhead-line"></div>
</div>

<context-menu #deleteMenu>
    <ng-template contextMenuItem (execute)="print('click')">X</ng-template>
</context-menu>

打印功能(只是控制台的日志)

private print(val : string) : void
{
  console.log(val)
}

这个ngx上下文菜单组件似乎没有太多支持,所以我有兴趣尝试其他方法。所以我想问大家的问题是:

1) 您知道有其他自定义菜单组件库可以很好地用于此目的吗?

或

谢谢

1 回复 | 直到 7 年前

Karsten 7 年前

使用此代码 (execute)="console.log('click')" console 在全球范围内)
因此,您需要从组件调用函数,如
(execute)="functionFromComponent('click')"

对于角度材质:可以通过以下方式添加手动触发器:

class MyComponent {
  @ViewChild(MdMenuTrigger) trigger: MdMenuTrigger;

  someMethod() {
    this.trigger.openMenu();
  }
}

然后绑定 someMethod() 正常点击事件(并过滤掉右键点击)

另请参见: https://material.angular.io/components/menu/overview

推荐文章

jeuxjeux20 Simone · 在网格上的ListBoxItem模板的内容外单击鼠标右键时,如何在其上显示上下文菜单?

6 年前

Arne Peirs · 单击列标题时,会显示ListView中的ContextMenu

6 年前

Michael Daniloff · 修改可编辑组合框(WPF)的关联菜单

7 年前

Patrick Bender · 使用批处理文件发送到

7 年前

pedrito · 不同来源的Contextmenu:为不同的menuitems设置不同的数据绑定

7 年前

user650881 · 在Chrome扩展中禁用父上下文菜单

7 年前

Lázár Zsolt · WPF上下文菜单位于鼠标左侧

7 年前

miatech · 有人能给我指一下列表视图中的上下文菜单吗

7 年前

LarsMonty · Angular中的自定义关联菜单

7 年前

pradeepradyumna · 如果选择了任何项目,C#contextmenustrip不会显示任何指示

7 年前