在线打印图片

项目中要做预览图片之后的打印，因为要打印页面的一部分，所以费了点劲

原理就是重新打开一个空的页面，把要打印的元素放进去，然后通过外部css样式设置其样式，然后调用打印的方法

 

let newWin = window.open('');
let print = document.getElementById("file");
newWin.document.write(print.outerHTML);
let link = newWin.document.createElement("link");
link.href = "../static/lib/fileView/css/screen.css";
link.type = "text/css";
link.rel = "stylesheet";
link.media = 'screen';
let link1= newWin.document.createElement("link");
link1.href = "../static/lib/fileView/css/print.css";
link1.type = "text/css";
link1.rel = "stylesheet";
link1.media = 'print';
newWin.document.head.appendChild(link);
newWin.document.head.appendChild(link1);
$timeout(() => {
  newWin.print();
}, 3000);

在这里我使用了两个外部的css文件，screen.css是页面展示效果，print.css是打印预览效果

在最后，使用timeout延迟，原因是要等新的页面把图片加载好，再打印，否则打印不出图片的

需要注意的点：！！

由于页面展示和打印预览对css的解析不一样，所以要分开设置。