CdkDrag

이 드래그 인스턴스에 첨부할 임의의 데이터입니다.

드래그 중인 엘리먼트가 지정한 축을 따라서만 움직이도록 제한합니다.

cdkDrag 엘리먼트에서 시작해 DOM을 거슬러 올라가며 드래그할 루트 엘리먼트를 찾는 데 사용할 선택자입니다. 직접 접근할 수 없는 엘리먼트에 드래그 기능을 활성화할 때 다른 루트 엘리먼트를 지정하면 유용합니다.

드래그 가능한 항목의 위치를 제한할 경계 엘리먼트를 찾는 데 사용할 노드 또는 선택자입니다. 문자열을 전달하면 엘리먼트의 부모부터 DOM을 거슬러 올라가며 일치하는 엘리먼트를 찾는 선택자로 사용합니다.

사용자가 포인터를 누른 후 엘리먼트의 드래그를 시작하기까지 기다릴 시간(밀리초)입니다.

드롭 컨테이너 밖에 있는 CdkDrag의 위치를 설정합니다. 다시 방문한 사용자를 위해 엘리먼트의 위치를 복원할 때 사용할 수 있습니다.

이 엘리먼트의 드래그 시작을 비활성화할지 여부입니다.

드래그하는 동안 항목의 위치를 제한하는 로직을 사용자 정의할 수 있는 함수입니다. 페이지에서 사용자 포인터의 현재 위치를 나타내는 점, 드래그 중인 항목의 참조와 크기를 인수로 받습니다. 항목을 렌더링할 위치를 나타내는 점을 반환해야 합니다.

미리보기 엘리먼트에 추가할 클래스입니다.

항목의 미리보기를 삽입할 위치를 설정합니다. CDK_DROP_LIST를 통해 전역으로 설정할 수 있습니다. 가능한 값은 다음과 같습니다:

• global - 미리보기를 <body>의 맨 아래에 삽입합니다. overflow: hidden이나 z-index를 신경 쓰지 않아도 된다는 장점이 있지만, 항목의 상속된 스타일은 유지되지 않습니다.
• parent - 미리보기를 드래그 항목의 부모 안에 삽입합니다. 상속된 스타일이 유지된다는 장점이 있지만, overflow: hidden에 의해 잘리거나 z-index 때문에 보이지 않을 수 있습니다. 또한 미리보기는 :nth-child 같은 선택자와 일부 flexbox 설정에 영향을 줍니다.
• ElementRef<HTMLElement> | HTMLElement - 미리보기를 특정 엘리먼트 안에 삽입합니다. parent와 같은 장단점이 있습니다.

드래그하는 엘리먼트의 부모에 scale 변환이 적용되어 있으면 드래그 시작 시 위치가 어긋날 수 있습니다. 이 입력으로 CDK에 배율을 알려주세요.

사용자가 항목의 드래그를 시작할 때 발생합니다.

사용자가 드래그 항목을 놓은 후 애니메이션이 시작되기 전에 발생합니다.

사용자가 컨테이너 안에서 항목의 드래그를 중단할 때 발생합니다.

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

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

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

사용자가 항목을 드래그하는 동안 발생합니다. 드래그한 픽셀마다 발생하므로 주의해서 사용하세요.