Angular，拖放，在拖动元素时更改文本答案

【问题标题】：Angular, Drag and Drop, change text while dragging elementAngular，拖放，在拖动元素时更改文本
【发布时间】：2020-04-15 14:09:59
【问题描述】：

如何更改可拖动元素的文本，在拖动时，我有来自 cdk/drag-and-drop 库的 sn-p。它提供参数以在拖动时捕获事件。我可以通过本机元素进行更改，但它会更改所有样式，而且我需要在拖动或其他操作上设置另一个事件。有哪些选项，如果我想在拖动元素上放置随机文本？

在 HTML 中

(cdkDragStarted)="dragStarted($event)"

在 TS 中

dragStarted(event) {  
    event.source.element.nativeElement.textContent = '1212';
  }

【问题讨论】：

标签： angular drag-and-drop

【解决方案1】：

如果你想在拖动元素上放置随机文本，你应该使用*cdkDragPreview

【讨论】：

非常感谢，你让我开心！我知道如何使用 Vanila JS，但不知道这个模块。

【解决方案2】：

我不是 100% 确定，但我知道 renderer2 是处理来自 ts 文件的模板交互的推荐方法。也许在拖动方法中尝试使用 renderer2 修改文本。如果它仍然没有正确更改，我的下一步将是在 dragStarted 方法中进行一些手动更改检测。如果您希望它在被拖动时临时更改，muravev 的响应可以满足您的需求。

【讨论】：

在我的情况下，我需要在拖动元素期间进行一些计算，在你的情况下，我需要在放置时再次修改文本，我认为这会比使用现有指令更复杂。