Question

我试图通过点击按钮将文本复制到剪贴板。

我正在使用下面的库，但是该库中唯一缺少的是没有显示如何在复制内容时显示工具提示：

https://www.npmjs.com/package/angular-clipboard

我已尝试过以下问题的答案，但这些答案似乎不起作用，所以我最终使用上面的库：

AngularJS copy to clipboard

how to get clipboard data in angular JS

我想完全按照以下问题答案所示的方式显示我的工具提示：

Tooltips + Highlight Animation With Clipboard.js Click

Answer 1

所以我有点工作了。

不幸的是，如果您使用bootstrap工具提示，我们必须使用一些j来执行此操作。

这是解决问题的plunkr。

基本上，归结为这几行代码：

 var myEl = angular.element( document.querySelector( '#copyButton' ) );
  myEl.attr('title', 'Copied!')
      .tooltip('fixTitle')
      .tooltip('show');

  myEl.attr('title',"Copied");

  myEl.on('hidden.bs.tooltip', function () {
    // do something…
    myEl.attr('title', $scope.copyButtonToolTip)
          .tooltip('fixTitle');
  });

此外，您应该使用bootstrap版本3而不是v4。

Updated Plunkr

内容复制到剪贴板时如何显示工具提示？

1 个答案: