угловой 2 jsPDF.Данные о недвижимости не отображаются в PDF - PullRequest
Новая
       9

угловой 2 jsPDF.Данные о недвижимости не отображаются в PDF

0 голосов
/ 25 августа 2018

Я использую jsPDF для генерации PDF из HTML.Когда я нажимаю кнопку загрузки, первый файл PDF не отражает обновленный заголовок.Если я нажму кнопку еще раз, она начнет отражать обновленный заголовок.Я попытался отладить его и обнаружил, что innerHTML для DIV не отражается сразу после изменения свойства.Как только я нажимаю кнопку снова, она выбирает обновленное свойство из последнего нажатия и отображает значение.

HTML-код: - 

<button (click)="onGenerate()">Download Invoice</button>

<div #invoicePDF style="display: block;">
  {{pdfTitle}}
</div>

Код компонента: - 

import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
import * as jsPDF from 'jspdf';

export class GroupComponent {
private pdfTitle = "Initial Title";

@ViewChild('invoicePDF') invoicePDF: ElementRef;

public onGenerate(){ 
    this.pdfTitle = "Updated Title";

    const doc = new jsPDF('p','pt','a4');
    let content = this.invoicePDF.nativeElement;

    let specialElementHandler = {
      '#editor': function (element, renderer) {
        return true;
      }
    };

    doc.fromHTML(content.innerHTML, 15, 15, {
      'width': 200,
      'elementHandlers': specialElementHandler
    }, function() {
      doc.save('Invoice.pdf');
    });
}
}

1 Ответ

0 голосов
/ 25 августа 2018

Вам нужно обернуть код создания PDF внутри блока setTimeout (). Это сообщит Angular, чтобы активировать обнаружение изменений. 

setTimeout(()=>{
      doc.fromHTML(content.innerHTML, 15, 15, { 
        'width': 200, 'elementHandlers': specialElementHandler }, 
         function() { doc.save('Invoice.pdf'); 
      })},
 0);
...