angular / angular/components

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

未关闭
#23,766 4 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看
area: cdk/drag-drop P3
主要语言
TypeScript
星标
25k
派生
6.8k
平均合并
1 天 8 小时
30 天内合并 PR
91

描述

#### 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".

贡献指南

打开贡献指南

调研方向

从链接的 StackBlitz 示例 src/app/cdk-drag-drop-disabled-sorting-example.ts 开始,在禁用排序的情况下复现列表之间的拖动。然后跟踪 CDK drag-drop 的连接列表行为,该行为会放置占位符。完成标准是选择并实现一种一致的接收列表行为,并为报告的复现提供覆盖。

由索引模型根据 Issue 内容生成。

评估

技术栈
angular, typescript
领域
frontend
Issue 类型
缺陷
难度
5/5
预计耗时
一周以上
活跃度
停滞
描述清晰度
基本清楚
新手友好度
30/100

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。