AngularJS 如何实现复制到剪切板的功能？

[HappyZiJunLuo]

AngularJS如何实现复制到剪切板的功能？

实践方案

上网查资料时发现有很多实现这个功能的例子，我尝试了其中最简单的一种方法，就是利用原生JS
中的document.execCommand('copy')方法实现: 详见参考链接

js部分

toClipboard(content) {
    const copyElement = angular.element(`<span id="ngClipboardCopyId">${content}</span>`);
    const body = injector.get('$document').find('body').eq(0);

    body.append(injector.get('$compile')(copyElement)(injector.get('$rootScope')));
    const ngClipboardElement = angular.element(document.getElementById('ngClipboardCopyId'));
    const range = document.createRange();

    range.selectNode(ngClipboardElement[0]);
    window.getSelection().removeAllRanges();
    window.getSelection().addRange(range);
    document.execCommand('copy');
    window.getSelection().removeAllRanges();
    copyElement.remove();
}

html部分

<input type="text" class="code-input" ng-model="vm.arrangeCode">
<button class="btn-function-normal" ng-click="vm.toClipboard(vm.arrangeCode)">复制</button>

用这种方法虽然实现了功能，但有太多的DOM操作，因此不是很理想的方案

其他方案：

1. 参考ng-clip源码，其中部分代码看不懂，求大神指点 参考链接
2. 安装依赖库angular-clipboard 参考链接