javascript - 如何在Angular应用程序中将textarea内容复制到剪贴板

我在Angular 7应用程序中有一个textarea，单击按钮时需要将其内容复制到剪贴板。我在按钮的点击处理程序上使用以下代码：

if (this.txtConfigFile) {
    // Select textarea text
    this.txtConfigFile.nativeElement.select();

    // Copy to the clipboard
    document.execCommand("copy");

    // The following lines (in theory) unselect the text (DON'T WORK)
    this.txtConfigFile.nativeElement.value = this.txtConfigFile.nativeElement.value;
    this.txtConfigFile.nativeElement.blur();
}

注意：txtConfigFile是对textarea元素的引用，我在组件的声明中使用@ViewChild获得它：

@ViewChild('txtConfigFile') txtConfigFile: ElementRef;

这可以正常工作，但仍会选择文本区域文本，我想避免这种情况。将文本复制到剪贴板后，如何取消选择？

谢谢。

最佳答案

而是在选择要取消选择的文本后添加this.txtConfigFile.nativeElement.setSelectionRange(0, 0);：

 if (this.txtConfigFile) {
  // Select textarea text
  this.txtConfigFile.nativeElement.select();

  // Copy to the clipboard
  document.execCommand("copy");

  // Deselect selected textarea
  this.txtConfigFile.nativeElement.setSelectionRange(0, 0);

}

DEMO

关于javascript - 如何在Angular应用程序中将textarea内容复制到剪贴板，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/53866541/