ContextMenuComponent
Represents the Kendo UI ContextMenu component for Angular.
@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 }];
}
Selector
kendo-contextmenu
Export Name
Accessible in templates as #kendoContextMenuInstance="kendoContextMenu"
Inputs
alignToAnchor
boolean
Indicates that the ContextMenu will be aligned to the target or to the filter
element (if specified).
anchorAlign
Align
Specifies the pivot point of the anchor. Applicable if alignToAnchor
is true
.
animate
boolean | MenuAnimation
Sets the Menu animation.
appendTo
ViewContainerRef
Defines the container to which the popup will be appended.
ariaLabel
string
Sets the value for the aria-label
attribute of the ContextMenu.
collision
Collision
Configures the collision behavior of the popup.
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.
popupAnimate
boolean | PopupAnimation
Specifies the popup animation.
showOn
string
Specifies the event on which the ContextMenu will open (see example).
Accepts the name of a native DOM event. Defaults to contextmenu
which opens the ContextMenu for the target element.
target
HTMLElement | ElementRef | ContextMenuTargetContainerDirective | string
Specifies the element for which the ContextMenu will open (see example).
vertical
boolean
(default: true) Specifies if the Menu will be vertically rendered (see example).
Events
close
Fires when a Menu item is closed.
open
Fires when a Menu item is opened.
popupClose
Fires when the Menu is closed.
popupOpen
Fires when the Menu is opened (see example).
select
Fires when a Menu item is selected.
Methods
hide
Hides the ContextMenu.
show
Shows the ContextMenu for the specified target.
Parameters
target
Offset | HTMLElement | ElementRef
The offset or the target element for which the ContextMenu will open.