Hacktoberfest 2026: los issues que los mantenedores marcaron para octubre, abiertos y aptos para principiantes. Explorar issues de Hacktoberfest

Cdk Drag Item With Boundaries Breaks on Touch Screen Pinch

Abierto
  • ¿Algo no está bien?
#33,026 0 comentarios 0 reacciones 0 asignados Ver en GitHub

Los mantenedores suelen responder en 1 día

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
3/5
Tiempo estimado
1-2 días
Aptitud para principiantes
45/100
Tipo de issue
Error
Claridad
Bastante claro
Estado de actividad
Tranquilo
Stack tecnológico
angular, typescript
Área
frontend

Línea de trabajo

Comienza con el ejemplo de Angular CDK drag-drop en angular.dev/guide/drag-drop#restrict-movement-within-an-element y reproduce el problema en una pantalla táctil usando el gesto de pellizco descrito. Rastrea el manejo de touchmove del elemento arrastrable y la intervención cancelable=false; se considera terminado cuando el elemento permanece dentro de sus límites durante el gesto sin producir el error indicado.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

area: cdk/drag-drop area: core P4
Which @angular/* package(s) are the source of the bug?

Don't known / other

Is this a regression?

No

Description

Go to your website to this link: https://angular.dev/guide/drag-drop#restrict-movement-within-an-element on a touch screen device

  1. Go to the cdkDrag item with the boundaries.
  2. Start a pinch motion with one finger on the drag item and one outside
  3. Try a few times because it does work every time
  4. Observe the cdkDrag item float out of the area
Please provide a link to a minimal reproduction of the bug

https://angular.dev/guide/drag-drop#restrict-movement-within-an-element

Please provide the exception or error you saw
This error on every touch move event
[Intervention] Ignored attempt to cancel a touchmove event with cancelable=false, for example because scrolling is in progress and cannot be interrupted.
Please provide the environment you discovered this bug in (run ng version)
Angular CLI: 20.3.20
Node: 22.14.0
Package Manager: npm 10.9.2
OS: win32 x64


Angular: 20.3.18
... animations, common, compiler, compiler-cli, core, forms
... language-service, localize, platform-browser, router

Package                         Version
---------------------------------------
@angular-devkit/architect       0.2003.20
@angular-devkit/build-angular   20.3.20
@angular-devkit/core            20.3.20
@angular-devkit/schematics      20.3.20
@angular/build                  20.3.20
@angular/cdk                    20.2.14
@angular/cli                    20.3.20
@angular/material               20.2.14
@schematics/angular             20.3.20
ng-packagr                      20.3.2
rxjs                            7.8.2
typescript                      5.9.3
zone.js                         0.15.1
Anything else?

No response

Lenguaje dominante
TypeScript
Estrellas
25k
Forks
6.8k
Merge medio
1 d 11 h
PR fusionados (30 d)
106

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de angular/components

Todos los issues de angular/components

Issues similares

Más issues de TypeScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.