angular / angular/components

bug(drag-drop): cdkDropListSortingDisabled interacts badly with connected lists

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

Description

#### Reproduction

This is a fork of the "disable sorting" example from the docs.

https://stackblitz.com/edit/angular-lcgpvd?file=src/app/cdk-drag-drop-disabled-sorting-example.ts

Steps to reproduce:
1. Open example
2. Drag an item from one list to another


#### Expected Behavior

One of the following, internally-consistent behaviors:

* the receiving list provides some way of determining where the incoming item will be sorted
* the incoming item always goes before the first item
* the incoming item always goes after the last item

#### Actual Behavior

The incoming item gets a placeholder wherever the user drags it, but then can't be moved. The user can continue dragging back to the original list, so the placeholder goes back to the original position then drag over the target list again to put the placeholder in a new position -- but again, can't move the placeholder directly.

#### Environment

- Angular: 12.2.9
- CDK/Material: 12.2.9
- Browser(s): Chrome
- Operating System (e.g. Windows, macOS, Ubuntu): Win10

#### Comments

I'd like to see the first behavior implemented -- let me supply a sort-function that gets the dragged item's `data` (and maybe the index in its current container?) as an input and outputs the list index at which the placeholder should be inserted. Failing that, I'd at least like a property that lets me say that, since sorting is disabled, the placeholder should go at the "start" or "end".

Guide de contribution

Ouvrir le guide de contribution

Piste de recherche

Commencez par l’exemple StackBlitz lié dans src/app/cdk-drag-drop-disabled-sorting-example.ts et reproduisez le glissement entre des listes connectées avec le tri désactivé. Suivez ensuite le comportement de CDK drag-drop des listes connectées qui positionne l’espace réservé. C’est terminé lorsqu’un comportement cohérent de la liste réceptrice a été choisi et implémenté, avec une couverture pour la reproduction signalée.

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

Évaluation

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

Recevez les nouvelles issues par e-mail

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