问题描述
我想使用Syncfusion ej2在我的标签上创建具有关闭标签功能的右键单击上下文菜单。但是我找不到有关此特定功能的任何文档。
解决方法
您可以将Syncfusion的上下文菜单添加为选项卡作为内容模板。希望下面的文档对您有所帮助。
上下文菜单文档:
https://ej2.syncfusion.com/angular/documentation/context-menu/getting-started/
我们已经检查了您报告的要求,可以通过使用open和close方法在ContextMenu中实现此要求。有关更多详细信息,请参阅以下链接。
API链接:https://ej2.syncfusion.com/documentation/api/context-menu/#open https://ej2.syncfusion.com/documentation/api/context-menu/#close
文档链接:https://ej2.syncfusion.com/documentation/context-menu/how-to/open-and-close-contextmenu/
如果您需要进一步的帮助,请检查上面的链接并返回给我们。
关于, Sangeetha M
,通过传递相应的索引以关闭选项卡,可以使用选项卡的“ removeTab”公用方法。我们已根据您的要求准备了样品。
<div>
<ejs-tab id="appTab" showCloseButton="true">
<e-tab-tabitems>
<e-tab-tabitem header="ViewBag.headerTextOne" content="@contentOne"></e-tab-tabitem>
<e-tab-tabitem header="ViewBag.headerTextTwo" content="@contentTwo"></e-tab-tabitem>
<e-tab-tabitem header="ViewBag.headerTextThree" content="@contentThree"></e-tab-tabitem>
</e-tab-tabitems>
</ejs-tab>
<ejs-contextmenu id="contextmenu" target="#appTab" items="ViewBag.menuItems" select="menuClick"></ejs-contextmenu>
</div>
<script>
function menuClick(args) {
if (args.item.text == "Close All") {
var tab = document.getElementById('appTab').ej2_instances[0];
for (i = $('#appTab .e-toolbar-item').length; i >= 0; i--) {
tab.removeTab(i);
}
} else if (args.item.text == "Close This Tab") {
var tab = document.getElementById('appTab').ej2_instances[0];
var activeTab = tab.selectedItem;
tab.removeTab(activeTab);
}
}
</script>
示例:https://www.syncfusion.com/downloads/support/directtrac/298062/ze/TabComponent673764834 https://ej2.syncfusion.com/documentation/api/tab/#removetab
关于, Sangeetha M