如何使用Syncfusion ej2在上下文菜单中创建关闭功能

问题描述

我想使用Syncfusion ej2在我的标签上创建具有关闭标签功能的右键单击上下文菜单。但是我找不到有关此特定功能的任何文档。

解决方法

您可以将Syncfusion的上下文菜单添加为选项卡作为内容模板。希望下面的文档对您有所帮助。

上下文菜单文档:
https://ej2.syncfusion.com/angular/documentation/context-menu/getting-started/

使用标签文档模板:
https://ej2.syncfusion.com/angular/documentation/tab/getting-started/#initialize-the-tab-using-template

,

我们已经检查了您报告的要求,可以通过使用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