angular - Angular7放置区：点击事件未触发

Question

在阅读了这篇关于 Angular Material 7 关于拖放交互的新特性的博客文章后，我决定尝试使用示例代码。

它围绕三个列表工作，拖放事件在三个列表之间移动元素。这非常有效，当尝试修改第一个列表以使其元素成为按钮时会出现问题：

<div *ngFor="let item of newItems" [cdkDragData]="item" cdkDrag>
<button (click)="clicked($event)"> {{ item }}</button>
</div>

问题是单击事件似乎没有被触发，就好像拖放事件“覆盖了它们”一样。

这是代码：

https://stackblitz.com/edit/mat-drag-drop-bwkdcy

编辑：找到了一个事件监听器的解决方法，没什么大不了的。

Answer 1

(mousedown)="clicked($event)"完成工作。

Answer 2

尝试使用函数 $event.stopPropagation() 仅触发此事件

<div *ngFor="let item of newItems" [cdkDragData]="item" cdkDrag>
     <button (click)="$event.stopPropagation();clicked($event)"> {{ item }}</button>
</div>