Конвертировать HTML в PDF в Angular 10 - PullRequest
4 голосов
/ 04 августа 2020
  1. Я пытаюсь сгенерировать PDF из моей HTML страницы. Это отлично работает, если данные привязаны к td напрямую из ts. Если я попытаюсь привязать значение к input, оно этого не прочитает. Ниже приведен рабочий Stackblitz для того же самого.
  2. Если я попытаюсь сгенерировать PDF для моей полной страницы, структура изменится. Идеально подходит только для стола. Я использую jsPDF для всего вышеперечисленного. Есть ли способ распечатать всю страницу и сгенерировать URI данных?

1 Ответ

0 голосов
/ 04 августа 2020

Попробуйте это

html

<td id="myTd"><input [(ngModel)]="userName" type="text" 
[value]="userName"></td>

ts

export class AppComponent  {
  name = 'Angular Html To Pdf ';
  userName: string;

  @ViewChild('pdfTable', {static: false}) pdfTable: ElementRef;


  public downloadAsPDF() {
    const doc = new jsPDF();

    var x = document.getElementById("myTd");
    x.innerHTML = this.userName;

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

    const pdfTable = this.pdfTable.nativeElement;

    doc.fromHTML(pdfTable.innerHTML, 15, 15, {
      width: 190,
      'elementHandlers': specialElementHandlers
    });

   console.log(doc.output('dataurl'));
   console.log(this.userName);


  }
}

https://stackblitz.com/edit/angular-html-to-pdf-m-oeji6j?file=src%2Fapp%2Fapp.component.html

...