2017-08-31 54 views
1

我正在尝试生成包含角度分量的pdf。如何在doc.fromhtml()jspdf中包含角度组件?

打字稿:

let doc = new jsPDF();   

let source = document.getElementById("content"); 
doc.fromHTML(
    source, 
    15, 
    15, 
    { 
     'width': 180 
    }); 
doc.save("sample.pdf"); 
    } 

} 

HTML:

<div id="content"> 
    <sample-card *ngFor="let x of list; let i = index" 
     [selection] = list     
     <sample-card> 
    </div> 

我使用角4 doc.fromHTML()正在为简单的 '格' 喜欢被下载。但它不适用于角部件。如何实现这一目标?

回答

0

我这样做了,在应用程序的HTML的细节,它在细节显示这些值 Passsing值html的

在app.component.html

<div id="content" details [app1]="app" *ngFor="let app of applications"> 

在details.component。HTML

{{app1.labels}} 

在这里,我等待获得要加载的数据[与AfterViewChecked尝试 - 不断保存文件和AfterViewInit是给空(因为它正在执行只有一次)] 所以等待随机时间说5秒[不是很好,但它的下载文件]

setTimeout(()=>{  
     setTimeout(this.saveFile(), 1000*5); 
},3000); 

这里是我得到的输出[左PDF和正确的网页有一些额外的内容]

enter image description here

有关顶部格的ID

<div id="content" > 
     Things to Learn 
    <div details [app1]="app" *ngFor="let app of applications"> 
    </div> 
    Hari 
    </div> 

输出是:

enter image description here

方法-2:

在这里,我使用事件发射器告诉父母何时保存文件

当子组件收到项目数组中的最终项目[父项传递给子项],告诉父项现在保存该文件[因为我已收到您的所有项目的数组在

与AfterViewInit实现,其中它发出的真实时长和数量都相同

左html和右TS [母公司]

enter image description here

左TS和右HTML

enter image description here

输出

enter image description here

+0

方法-2下添加其他方法[儿童]! ! –

+0

我可以发布它作为新的,请建议,谢谢@ mxr7350 –