建议
- 一开始,想使用ngx-contextmenu来实现,需要引入第三方库,结果导入包的时候引用容易出问题。建议使用ng-zorro-antd的context-menu来开发
Demo
//触发右键菜单的创建
<div (contextmenu)="contextMenu($event,template)"></div>
<ng-template #template>
//右键菜单的item项
<ul nz-menu nzInDropDown (nzClick)="close()">
<li nz-menu-item (click)="changeChartType()">饼图</li>
<li nz-menu-item>柱状图</li>
</ul>
</ng-template>
import { NzDropdownService, NzDropdownContextComponent} from "ng-zorro-antd";
//构造函数里注入右键菜单的服务
private dropdown: NzDropdownContextComponent;
constructor( private nzDropdownService: NzDropdownService) { }
close(): void {
this.dropdown.close();
}
//右键菜单的菜单项的单击事件处理
changeChartType(): void {
}