angular / angular/components

feat(cdkDrag): cdkDragHandleBoundary

Offen
#27,803 1 Kommentar 2 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen
area: cdk/drag-drop feature
Vorherrschende Sprache
TypeScript
Sterne
25k
Forks
6.8k
Ø Merge
1 T. 8 Std.
Gemergte PRs (30 T.)
91

Beschreibung

### Feature Description

I want to limit where my dragable component can be dragged to but by its handle element rather than by its entire dragable element.

### Use Case

A bottom sliding drawer. If I can mark the entire drawer with `cdkDrag`, place `cdkDragHandle` on the drawer's handle, limit motion to the y axis, and then have a new `cdkHandleBoundary` directive then my boundary element can use overflow clipping so that when the handle is dragged to the bottom of the boundary the entire drawer content is hidden and when the handle is dragged upward then the drawer content is shown.

Beitragsleitfaden

Beitragsleitfaden öffnen

Rechercherichtung

Beginne damit, die Einstiegspunkte cdkDrag und cdkDragHandle zu lesen und nachzuverfolgen, wie ihre Bewegungsgrenzen definiert sind. Ermittle, wie eine neue cdkHandleBoundary-Direktive das Ziehen durch den Handle einschränken würde, während die Bewegung entlang der y-axis und das Abschneiden von Überläufen für den Drawer-Anwendungsfall erhalten bleiben. Als erledigt gilt die Aufgabe, wenn das angeforderte handle-basierte Grenzverhalten implementiert und für das beschriebene Sliding-Drawer-Szenario verifiziert ist.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
angular, typescript
Bereich
frontend
Issue-Typ
Feature
Schwierigkeit
5/5
Geschätzter Aufwand
Über eine Woche
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
35/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.