angular / angular/components

bug(cdkDrag): "pointerPosition" property of the "CdkDragMove" event is not correct with "cdkDragBoundary"

Đang mở
#29,867 1 bình luận 0 reaction 0 người được giao Xem trên GitHub

Chưa có ai nhận issue này.

area: cdk/drag-drop needs: discussion
Ngôn ngữ chính
TypeScript
Star
25k
Fork
6.8k
Merge trung bình
1 ngày 8 giờ
Pull request đã merge (30 ngày)
91

Mô tả

Is this a regression?
  • Yes, this behavior used to work in the previous version
The previous version in which this bug was not present was

No response

Description

Context
According to the official documentation, the property "pointerPosition" of the "CdkDragMove" event is : "Position of the user's pointer on the page."
See : https://material.angular.io/cdk/drag-drop/api#CdkDragMove

Problem
If I use the "cdkDragBoundary" property, the property "pointerPosition" returns cursor position only between boundaries.

Reproduction

StackBlitz link: https://stackblitz.com/edit/stackblitz-starters-knrvcz?file=src%2Fmain.ts
Steps to reproduce:

  1. Move the red block until the cursor moves out of the blue block
  2. At the bottom of the blue box, you will see that the cursor position is stuck to the boundaries of the blue box.
Expected Behavior

I expect to have the current position of the cursor on screen, wherever it is located.

Actual Behavior

The position displayed of the cursor is limited to the limits of the blue block

Environment
  • Angular: 18.2.8
  • CDK/Material: 18.2.8
  • Browser(s): Chrome 129.0.6668.100
  • Operating System (e.g. Windows, macOS, Ubuntu): Windows 11

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Hướng nghiên cứu

Bắt đầu với bản tái hiện StackBlitz được liên kết trong src/main.ts và so sánh hành vi được ghi trong tài liệu của pointerPosition trong CdkDragMove với kết quả khi cdkDragBoundary xuất hiện. Theo dõi quá trình xử lý thao tác kéo của CDK tạo ra sự kiện, sau đó xác minh rằng pointerPosition vẫn là vị trí trên màn hình của con trỏ bên ngoài ranh giới, trong khi phần tử được kéo vẫn bị giới hạn.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Đánh giá

Công nghệ
angular, typescript
Lĩnh vực
frontend
Loại issue
Lỗi
Độ khó
3/5
Thời gian dự kiến
1-2 ngày
Mức độ hoạt động
Đình trệ
Độ rõ ràng
Khá rõ ràng
Mức phù hợp với người mới
45/100

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.