angular2 jsPdf pdf der gesamten div erzeugen

Question

Ich versuche, pdf meiner Ansicht mit jsPdf zu erzeugen, die erfolgreich ist, außer der Tatsache, dass es pdf des Teils erzeugt, der im Blick und nicht der gesamte html ist.

<div style="padding: 1%;"> 
    <button mdl-button mdl-button-type="raised" (click)="download()">download </button> 
</div> 

<div class="mdl-grid" id='entireDownload'> 

... 
... => here is a big html whose content do not fit in 100vh viewport 

</div> 

und meine Komponente:

download() { 

    //var doc = new jsPDF(); 
    const elementToPrint = document.getElementById('entireDownload'); //The html element to become a pdf 
    const pdf = new jsPDF('p', 'pt', 'a4'); 
    pdf.addHTML(elementToPrint,() => { 
     // Save the PDF 
     pdf.save('behavior-variables.pdf'); 
    }); 

    } 

Wie kann ich sicherstellen, dass meine Download-Funktion pdf des gesamten div erzeugt und nicht nur den Inhalt, die auf einmal zu sehen ist?

Answer 1

Theoretisch können Sie Ihr jsPDF-Objekt mit den gewünschten Dimensionen instanziieren. Diese Dimensionen müssen Ihre divs diejenigen erfüllen:

var pdfDoc = new jsPDF('p', 'pt', [divWidth, divHeight]); 

Aber aus irgendeinem Grund ist es nicht für mich arbeiten: die Höhe ist immer falsch

Meine Arbeit um ist die erste Seite zu löschen und eine neue hinzufügen mit den erwarteten Dimensionen:

var pdfDoc = new jsPDF('p', 'pt', [0, 0]); //Units 'pt' are important! 
pdfDoc.deletePage(1); 
pdfDoc.addPage(myDivWidth, myDivHeight); 

Die ‚pt‘ (Punkte) Einheiten auf jede neue Seite angewendet werden, und es wird Ihre DIV Pixel Dimensionen