@angular/cdk/drag-drop

DropListRef

클래스

드롭 목록의 참조입니다. 컨테이너를 조작하거나 해제하는 데 사용합니다.

API

    
      class DropListRef<T = any> {}

constructor

DropListRef<T>

@paramelementHTMLElement | ElementRef<HTMLElement>

@param_dragDropRegistryDragDropRegistry

@param_documentany

@param_ngZoneNgZone

@param_viewportRulerViewportRuler

@returnsDropListRef<T>

element

HTMLElement | ElementRef<HTMLElement>

드롭 목록이 연결된 엘리먼트입니다.

disabled

boolean

이 컨테이너에서 드래그 동작을 시작하지 못하게 할지 여부입니다.

sortingDisabled

boolean

목록 안에서 항목 정렬을 비활성화할지 여부입니다.

lockAxis

"x" | "y" | null

컨테이너 안의 드래그 가능한 엘리먼트가 지정한 축을 따라서만 움직이도록 제한합니다.

autoScrollDisabled

boolean

사용자가 포인터를 가장자리 가까이 이동할 때 뷰의 자동 스크롤을 비활성화할지 여부입니다.

autoScrollStep

number

엘리먼트를 자동 스크롤할 때 프레임당 스크롤할 픽셀 수입니다.

hasAnchor

boolean

목록의 항목이 처음 컨테이너를 떠날 때 앵커 노드를 남겨야 하는지 여부입니다.

enterPredicate

(drag: DragRef<any>, drop: DropListRef<any>) => boolean

항목을 드롭 컨테이너로 이동할 수 있는지 결정하는 함수입니다.

sortPredicate

(index: number, drag: DragRef<any>, drop: DropListRef<any>) => boolean

항목을 특정 인덱스로 정렬할 수 있는지 결정하는 함수입니다.

beforeStarted

Subject<void>

드래그가 시작되기 직전에 발생합니다.

entered

Subject<{ item: DragRef<any>; container: DropListRef<any>; currentIndex: number; }>

사용자가 새 드래그 항목을 이 컨테이너로 옮겼을 때 발생합니다.

exited

Subject<{ item: DragRef<any>; container: DropListRef<any>; }>

사용자가 항목을 다른 컨테이너로 드래그하여 현재 컨테이너에서 제거할 때 발생합니다.

dropped

Subject<{ item: DragRef<any>; currentIndex: number; previousIndex: number; container: DropListRef<any>; previousContainer: DropListRef<any>; isPointerOverContainer: boolean; distance: Point; dropPoint: Point; event: MouseEvent | TouchEvent; }>

사용자가 컨테이너 안에 항목을 놓을 때 발생합니다.

sorted

Subject<{ previousIndex: number; currentIndex: number; container: DropListRef<any>; item: DragRef<any>; }>

사용자가 드래그 중 항목의 순서를 바꾸는 동안 발생합니다.

receivingStarted

Subject<{ receiver: DropListRef<any>; initiator: DropListRef<any>; items: DragRef<any>[]; }>

현재 목록과 연결된 목록에서 드래그 동작이 시작될 때 발생합니다.

receivingStopped

Subject<{ receiver: DropListRef<any>; initiator: DropListRef<any>; }>

현재 목록과 연결된 목록에서 드래그 동작이 중단될 때 발생합니다.

data

T

드롭 목록에 첨부할 수 있는 임의의 데이터입니다.

dispose

void

DOM 엘리먼트에서 드롭 목록 기능을 제거합니다.

@returnsvoid

isDragging

boolean

이 목록의 항목이 현재 드래그 중인지 여부입니다.

@returnsboolean

start

void

항목의 드래그를 시작합니다.

@returnsvoid

enter

void

항목을 컨테이너로 옮기려고 시도합니다.

@paramitemDragRef<any>

컨테이너로 옮겨진 항목입니다.

@parampointerXnumber

항목의 X축 위치입니다.

@parampointerYnumber

항목의 Y축 위치입니다.

@paramindexnumber | undefined

항목이 들어온 인덱스입니다. 생략하면 컨테이너가 자동으로 판단합니다.

@returnsvoid

exit

void

사용자가 항목을 다른 컨테이너로 드래그한 후 현재 컨테이너에서 제거합니다.

@paramitemDragRef<any>

밖으로 드래그된 항목입니다.

@returnsvoid

drop

void

이 컨테이너에 항목을 놓습니다.

@paramitemDragRef<any>

컨테이너에 놓는 중인 항목입니다.

@paramcurrentIndexnumber

항목을 삽입할 인덱스입니다.

@parampreviousIndexnumber

드래그를 시작했을 때 항목의 인덱스입니다.

@parampreviousContainerDropListRef<any>

항목을 드래그해 온 원래 컨테이너입니다.

@paramisPointerOverContainerboolean

항목을 놓았을 때 사용자의 포인터가 컨테이너 위에 있었는지 여부입니다.

@paramdistancePoint

드래그 동작이 시작된 후 사용자가 드래그한 거리입니다.

@paramdropPointPoint

@parameventMouseEvent | TouchEvent

드롭 동작을 시작한 이벤트입니다.

@returnsvoid

withItems

this

이 목록에 속하는 드래그 가능한 항목을 설정합니다.

@paramitemsDragRef<any>[]

이 목록에 속하는 항목입니다.

@returnsthis

withDirection

this

드롭 목록의 레이아웃 방향을 설정합니다.

@paramdirectionDirection

@returnsthis

connectedTo

this

이 컨테이너와 연결할 컨테이너를 설정합니다. 둘 이상의 컨테이너를 연결하면 사용자가 컨테이너 간에 항목을 옮길 수 있습니다.

@paramconnectedToDropListRef<any>[]

현재 컨테이너와 연결할 다른 컨테이너입니다.

@returnsthis

withOrientation

this

컨테이너의 배치 방향을 설정합니다.

@paramorientationDropListOrientation

컨테이너의 새 배치 방향입니다.

@returnsthis

withScrollableParents

this

드래그하는 동안 스크롤할 수 있는 부모 엘리먼트를 설정합니다.

@paramelementsHTMLElement[]

스크롤할 수 있는 엘리먼트입니다.

@returnsthis

withElementContainer

this

드래그 항목의 컨테이너로 다른 엘리먼트를 사용하도록 드롭 목록을 설정합니다. 드래그를 구성하는 전체 DOM을 직접 제어할 수 없는 경우에 유용합니다. 대체 컨테이너는 드롭 목록의 하위 엘리먼트여야 합니다.

@paramcontainerHTMLElement

지정할 새 엘리먼트 컨테이너입니다.

@returnsthis

getScrollableParents

readonly HTMLElement[]

이 드롭 컨테이너에 등록된 스크롤 가능한 부모 엘리먼트를 가져옵니다.

@returnsreadonly HTMLElement[]

getItemIndex

number

컨테이너 안에서 항목의 인덱스를 찾습니다.

@paramitemDragRef<any>

인덱스를 찾을 항목입니다.

@returnsnumber

getItemAtIndex

DragRef<any> | null

특정 인덱스의 항목을 가져옵니다.

@paramindexnumber

항목을 가져올 인덱스입니다.

@returnsDragRef<any> | null

isReceiving

boolean

연결된 드롭 목록에서 현재 드래그 중인 항목을 이 목록이 받을 수 있는지 여부입니다.

@returnsboolean