ContextMenuComponent
Represents the Kendo UI ContextMenu component for Angular.
Definition
Package:@progress/kendo-angular-menu
Selector:kendo-contextmenu
Export Name:Accessible in templates as #kendoContextMenuInstance="kendoContextMenu"
Syntax:
_@Component({
selector: 'my-app',
template: `
<div #target>
Right-click to open Context menu</p>
</div>
<kendo-contextmenu [target]="target" [items]="items"> </kendo-contextmenu>
`
})
class AppComponent {
public items: any[] = [{ text: 'item1', items: [{ text: 'item1.1' }] }, { text: 'item2', disabled: true }];
}Inputs
alignToAnchor
boolean
Specifies if the ContextMenu will be aligned to the target or to the filter element (if specified).
false
anchorAlign
Align
Specifies the pivot point of the anchor. Applicable if alignToAnchor is true.
{ horizontal: 'left', vertical: 'bottom' }
animate
boolean | MenuAnimation
Sets the Menu animation.
appendTo
ViewContainerRef
Defines the container to which the popups will be appended.
ariaLabel
string
Sets the value for the aria-label attribute of the ContextMenu.
Configures the collision behavior of the popup.
{ horizontal: 'fit', vertical: 'flip' }
filter
string
Specifies a CSS selector which filters the elements in the target for which the ContextMenu will open (see example).
hoverDelay
number
Specifies the delay in milliseconds before the Menu items are opened or closed on item hover or leave (see example). Used to avoid the accidental opening or closing of the items.
items
any[]
Specifies the Menu items.
openOnClick
boolean | OpenOnClickSettings
Specifies that the root items can be opened only on click (see example).
popupAlign
Align
Specifies the pivot point of the popup.
{ horizontal: 'left', vertical: 'top' }
popupAnimate
boolean | PopupAnimation
Specifies the popup animation.
true
Configures the popup settings for the Menu items. Allows customization of the popup class and margin.
showOn
string
Specifies the event on which the ContextMenu will open (see example).
Accepts the name of a native DOM event. For example, click, dblclick, mouseover, etc.
'contextmenu'
target
string | ContextMenuTargetContainerDirective | ElementRef<any> | HTMLElement
Specifies the element for which the ContextMenu will open (see example).
trackBy
TrackByFunction<any>
Defines a function that determines how to track for the menu items. By default, the component tracks changes by index.
vertical
boolean
Specifies if the Menu will be vertically rendered (see example).
true
Events
Fires when a Menu item is closed (see example).
Fires when a Menu item is opened (see example).
Fires when the Menu is closed (see example).
Fires when the Menu is opened (see example).
Fires when a Menu item is selected (see example).
Methods
Hides the ContextMenu.
Shows the ContextMenu for the specified target.
The offset or the target element for which the ContextMenu will open.