将角度视图转换为剪贴板

Question

我想将Angular指令中的视图渲染到图像中，以便用户可以右键单击它，然后将其复制到剪贴板。基本上我有一个指令，可以将信息编译成带有样式的漂亮的Bootstrap脚手架，并希望能够右键单击，复制到剪贴板，并作为img类型粘贴到文档中。

想象一下：

<div class="fancyCss">
    <MyCustomHeaderDirective2 dataVal="foo"></MyCustomHeaderDirective2>
    <MyCustomBodyDirective2>
       <div class="row">
        <- Content ->
    </MyCustomBodyDirective2>
</div>

因此，在页面上，他们会加载正确的＆＃39; foo＆＃39;，请参阅花式表，右键单击，并在剪贴板中显示表格。目前该过程是渲染，获取剪切工具，单击并拖动，复制，粘贴。

为清楚起见：这有可能吗？这个库是否存在？最重要的是，如何使用角度指令实现它？

Answer 1

如果您正在寻找纯客户端解决方案：https://html2canvas.hertzen.com/

或者，对于更加可自定义和万无一失的解决方案，您可以将带有内联样式的DOM传递到服务器端，并使用phantomJS进行渲染。拍摄快照，将其另存为图像并发送回客户端。

Answer 2

有一个图书馆

http://hertzen.com/experiments/jsfeedback/

http://html2canvas.hertzen.com/

工作原理

1. 捕获html dom内容并在画布中粘贴
2. 在Canvas中，您可以将内容转换为图片格式