DragTargetDirective

Represents the Kendo UI DragTarget directive for Angular. Use this directive to make an element draggable.

Selector

[kendoDragTarget]

Export Name

Accessible in templates as #kendoDragTargetInstance="kendoDragTarget"

Inputs

Name	Type	Default	Description
autoScroll	boolean | AutoScrollOptions	true	Sets the automatic container scrolling behavior when close to the edge. See example.
cursorStyle	string	'move'	Sets the cursor style of the drag target. Accepts same values as the CSS cursor property.
dragData	DragTargetDataFn		Defines a callback function used for attaching custom data to the drag target. The data is available in the events of the respective DropTarget or DropTargetContainer directives. The current DragTarget HTML element and its dragTargetId will be available as arguments.
dragDelay	number	0	Sets the delay in milliseconds before dragging begins. See example.
dragTargetId	string | DragTargetIdFn		Sets a unique identifier for the drag target.
hint	boolean | HintSettings	false	Defines whether a hint will be used for dragging. By default, the hint is a copy of the drag target. (see example).
mode	DragMode	'auto'	Specifies whether to use the default dragging behavior or handle it manually.
restrictByAxis	DragAxis		Restricts dragging to horizontal or vertical only. Applies when mode is auto. See example.
threshold	number	0	Sets the number of pixels the pointer must move before dragging starts. Applies when manualDrag is false. See example.

Events

Name	Type	Description
onDrag	EventEmitter<DragTargetDragEvent>	Fires while the user drags the drag target element.
onDragEnd	EventEmitter<DragTargetDragEndEvent>	Fires when dragging of the drag target ends and the element is released.
onDragReady	EventEmitter<DragTargetDragReadyEvent>	Fires when the drag target's dragDelay has passed and the user can drag the element.
onDragStart	EventEmitter<DragTargetDragStartEvent>	Fires when dragging of the drag target element begins.
onPress	EventEmitter<DragTargetPressEvent>	Fires when the user presses the drag target element.
onRelease	EventEmitter<DragTargetReleaseEvent>	Fires when DragTarget is released, either by dropping it on a drop target or by releasing the mouse button.