angular / angular/components

[CdkDrag]: Allow out of scope binding with drop container

Ouverte
#14,099 13 commentaires 9 réactions 0 personnes assignées Voir sur GitHub
area: cdk/drag-drop feature P4
Langage dominant
TypeScript
Étoiles
25k
Forks
6.8k
Merge moyen
1 j 8 h
PR mergées (30 j)
91

Description

#### Bug, feature request, or proposal: proposal

#### What is the expected behavior?
`CdkDrag` accepts `CdkDropListContainer` as an `@Input` (in addition to the current injection logic)

#### What is the current behavior?
`CdkDrag` accepts `CdkDropListContainer` from DI (optional) or through direct assignment.

#### What is the use-case or motivation for changing an existing behavior?
When `CdkDropListContainer` comes from DI it requires the drop container to be a direct parent of the drag element.

When working with dynamic content (table, tree, select, or any "portal like" components) it is sometimes not possible to have the container and the drag element in a parent/descendant relationship.

For example: In a `CdkTable` dragging a header cell left/right having the header row as the drop container. The row and cell are not defined as parent/descendant in the template and the view creators will not pass the proper injectables in such case.

The current implementation does not require a drop container, it's optional. So adding an `@Input` is quite simple. The init only happen when actual dragging starts so it shouldn't be an issue.

The `CdkDropList` will require some modifications because it uses a template query to get all of the child drag items it manages. This is also doable... Maybe by having a flag that defines the work mode or another directive that does not use a template query.

When a drag item is assigned a drop container it will notify the container so it can store a ref to it... doing the same when the drag is destroyed or disconnected from the parent drop container.

Thanks!

Guide de contribution

Ouvrir le guide de contribution

Piste de recherche

Lisez les implémentations de CdkDrag et CdkDropList, en commençant par leur comportement d’injection de dépendances et de découverte des drags enfants. Suivez la manière dont les conteneurs assignés dynamiquement sont connectés et déconnectés, puis définissez l’achèvement comme la prise en charge des relations drag/conteneur hors périmètre sans perdre le comportement existant basé sur le parent.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Évaluation

Stack technique
angular, typescript
Domaine
frontend
Type d'issue
Fonctionnalité
Difficulté
5/5
Temps estimé
Plus d'une semaine
Activité
À l'abandon
Clarté
Plutôt claire
Accessibilité débutants
35/100

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.