New to Kendo UI for AngularStart a free 30-day trial

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

Definition

Package:@progress/kendo-angular-utils

Selector:[kendoDragTarget]

Export Name:Accessible in templates as #kendoDragTargetInstance="kendoDragTarget"

Inputs

Sets the automatic container scrolling behavior when close to the edge. See example.

Default:

true

Sets the cursor style of the drag target. Accepts same values as the CSS cursor property.

Default:

'move'

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

Sets the delay in milliseconds before dragging begins. See example.

Default:

0

Sets a unique identifier for the drag target.

Defines whether a hint will be used for dragging. By default, the hint is a copy of the drag target. (see example).

Default:

false

Specifies whether to use the default dragging behavior or handle it manually.

Default:

'auto'

Restricts dragging to horizontal or vertical only. Applies when mode is auto. See example.

threshold

number

Sets the number of pixels the pointer must move before dragging starts. Applies when manualDrag is false. See example.

Default:

0

Events

Fires while the user drags the drag target element.

Fires when dragging of the drag target ends and the element is released.

Fires when the drag target's dragDelay has passed and the user can drag the element.

Fires when dragging of the drag target element begins.

Fires when the user presses the drag target element.

Fires when DragTarget is released, either by dropping it on a drop target or by releasing the mouse button.