Добавить в PDF пользовательский HTML, не добавляя его в DOM - PullRequest
Новая
       16

Добавить в PDF пользовательский HTML, не добавляя его в DOM

0 голосов
/ 25 апреля 2019

Я использую угловое приложение, я должен экспортировать страницу в формате PDF.

Шаблон, ожидаемый в pdf, отличается от веб-страницы.

Для этого я бы создал собственный html, а затем использовал html2canvas для преобразования html в изображение, которое я добавил в pdf файл.

Моя проблема заключается в том, что следует вызвать document.getElementById(); для существующего html, чтобы иметь возможность преобразовать его в изображение.

но эти пользовательские элементы HTML не должны появляться на веб-странице.

Что я ожидаю: Я хотел бы знать, как я могу добавить собственный HTML в PDF, не добавляя его в тело моей HTML-страницы.

Мой обходной путь - показывать пользовательский HTML только при нажатии на экспорт в pdf

HTML-страница 

  <div id="filters" *ngIf="exportPdfService.inExport">
    <span class="badge badge-secondary">..</span> <span class="badge badge-secondary">..</span> <span class="badge badge-secondary">..</span>
  </div>

Тогда по моему Ц 

exportPDF() {
    this.exportPdfService.inExport = true;
    const elm = this.logoActivity.nativeElement.src;
    const filtersElm = document.getElementById('filters');
    const logo = html2canvas(filtersElm).then(canvas => {
        pdf.addImage(canvas, 'png', 150, 45, canvas.width / 2, canvas.height / 2);
        pdf.save(`file_.pdf`);
    });
}

Но при экспорте элементы процесса видны.

Я ищу способ создать собственный HTML "в фоновом режиме"

...