建議
- 一開始寂曹，想使用ngx-contextmenu來實(shí)現(xiàn)射赛，需要引入第三方庫退客，結(jié)果導(dǎo)入包的時(shí)候引用容易出問題膘婶。建議使用ng-zorro-antd的context-menu來開發(fā)
Demo
//觸發(fā)右鍵菜單的創(chuàng)建
<div (contextmenu)="contextMenu($event,template)"></div>
<ng-template #template>
//右鍵菜單的item項(xiàng)
<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";
- 構(gòu)造函數(shù)里注入右鍵菜單的服務(wù)
//構(gòu)造函數(shù)里注入右鍵菜單的服務(wù)
private dropdown: NzDropdownContextComponent;
constructor( private nzDropdownService: NzDropdownService) { }
- 創(chuàng)建右鍵菜單和關(guān)閉右鍵菜單的代碼
close(): void {
this.dropdown.close();
}
//右鍵菜單的菜單項(xiàng)的單擊事件處理
changeChartType(): void {
}
