2017-08-31 6 views
1

角度成分を含むpdfを生成しようとしています。doc.fromhtml()jspdfに角度成分を含めるにはどうすればいいですか?

typescriptです:

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()を使用していますが、単純な 'DIV' のために働いてダウンロードすることが好き。しかし、角度のあるコンポーネントでは機能しません。これを達成する方法は?

答えて

0

私はこの方法でやった、それは詳細にそれらの値を表示する詳細にアプリのHTMLで Passsing値はdetails.componentでapp.component.html

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

をhtmlの。ここでは、HTML

{{app1.labels}} 

私は、データをロードするために得ることを待っている[AfterViewCheckedで試してみました - ファイルの保存を続けていると(それが一度だけ実行されるよう)AfterViewInitはNULLを与えている]だから、ランダムな時間を待っていた [いくつかの余分なコンテンツを持つWebページの右、左、PDFおよびオン]私が得た出力

enter image description here

は5秒[良いが、そのファイルはダウンロードしない]ここ

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

を言いますトップDIVにIDについて3210

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

出力は:

enter image description here

方法-2:

ここで私はイベントエミッタを使用して、ファイルを保存するときに親に通知する

子コンポーネントが[親から子に渡された]アイテムの配列から最後のアイテムを受け取ったときに、親の配列であなたのすべてのアイテム]

長さとカウントが左側のhtmlで、右のTSに

同じである場合、それは真の発するAfterViewInitで実装[]

を受けています01 [子供の]左TS上と右のhtmlの

方法-2の下に他のアプローチを追加

enter image description here

出力

enter image description here

+0

! ! –

+0

新しいものとして投稿してもらえますか?ありがとう@mxr7350 –

関連する問題