如何在Angular2中选择文本

Question

我有一个文本条目列表，后跟一个按钮：

<li *ngFor="let match of matches; let i = index">
  {{ match}} <button (click)="select(i)">Copy</button>
</li>

我想在用户按下按钮时将文本复制到剪贴板。

  public select(index:any){
    document.execCommand("copy");       
  }

这确实有效，但是，我必须首先选择相应文本的文本。我怎么能在Angular2中做到这一点？

Answer 1

查看usual methods

中的答案

问题是陈旧的，但前提是一样的。该标准禁止您在未明确同意将要复制的情况下使用用户的剪贴板。您无法跳过选择过程。实施方式因浏览器而异，但它几乎都是相同的。

了解详情：How can I copy to clipboard in HTML5 without using flash?

Answer 2

我使用过angular2-clipboard。它适用于角度版本2.0.0及更高版本。我使用clipboard.js。有关更多信息，请参阅其文档。

依赖

• Angular~2.0.s0

• clipboard.js

用法如下：

在component.html文件中

<button ngIIclipboard [cbContent]="textToCopy" (cbOnSuccess)="onSuccess($event)" class="bm-action-btn clickToCopyPolicy">Click to copy text</button>

在component.ts文件中

textToCopy = "xyz";