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

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

所以我有点让它工作了。

不幸的是，如果您使用引导工具提示，我们必须使用一些 js 来完成它。

这是一个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