自定义组件动画在 Angular 9 + CDK`on drag n drop 中不起作用

Question

我正在尝试创建一个用户可以重新排序项目的列表，使用@angular/cdk/drag-drop 并按照官方文档 (https://material.angular.io/cdk/drag-drop/overview) 中的示例进行操作非常简单。

我的示例确实有效，它可以在拖放时重新排序列表，但动画不适用于自定义组件，我的意思是，列表容器和列表项是自定义组件，如您在 Stackblitz 中所见：

如何使动画像 Angular "Drag&Drop sorting" 示例中那样工作？

提前致谢，

Answer 1

我认为如果将组件放在可拖动对象 div 中，内置动画应该会起作用

<div *ngFor="let file of files" cdkDrag>
    <app-upload-item>
        {{file}}
    </app-upload-item>
</div>

Custom component animation does not work in Angular 9 + CDK`on drag n drop