zoukankan      html  css  js  c++  java
  • html2canvas下载图片保存到本地(angular为例)

    1、命令:npm install --save html2canvas

    2、在angular.json中引入

    3、在typings.d.ts中定义下

    4、html代码

    <div id="capture">页面内容(要保存部分id为capture)</div>
    <a #downLoadImg class="down-load" href="" download="{{title}}.jpg">
      <i *ngIf="isDown" title="保存图片" class="anticon anticon-save"></i>
    </a>

    5、ts代码

    @ViewChild('downLoadImg') downloadimg: ElementRef;
    // 下载
    downLoadImg() {
      const that = this;
      this.isDown = false;
      setTimeout(() => {
        html2canvas(document.querySelector("#capture")).then(canvas => {
        that.downloadimg.nativeElement.href = canvas.toDataURL("image/jpeg");
        that.isDown = true;
      });
      },1200)
    }
  • 相关阅读:
    this指向
    作用域链
    入门
    一、servlet之初见
    jdbc之mysql
    第六章、树和二叉树
    第七章、暴力求解法
    机试
    第十三章、字符串
    栈和队列
  • 原文地址:https://www.cnblogs.com/boreguo/p/11303657.html
Copyright © 2011-2022 走看看