Я установил ngx-extended-pdf-viewer@18 и angular 13. Все работает хорошо. Но теперь я хочу загрузить редактируемый PDF-файл отдельной кнопкой, как мне этого добиться. пожалуйста помоги
в HTML-файле
<ngx-extended-pdf-viewer #pdfViewer [src] = "pdfSrc" [contextMenuAllowed] = "false"
[enablePrint] = "false"
[showSidebarButton] = "false"
[showOpenFileButton] = "false"
[showSecondaryToolbarButton] = "false"
height = "80vh"></ngx-extended-pdf-viewer>
<button (click) = "downloadPdf()">Download it</button>
в ts-файле
import {Component, ElementRef, OnInit, ViewChild, NgZone} from '@angular/core';
import SignaturePad from 'signature_pad';
import {PDFDocumentProxy} from 'ng2-pdf-viewer';
import {PDFDocument} from 'pdf-lib';
import {HttpClient} from "@angular/common/http";
import {IPDFViewerApplication, NgxExtendedPdfViewerComponent, PdfDownloadedEvent} from "ngx-extended-pdf-viewer";
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit {
// pdf document
pdfSrc = '../assets/download.pdf';
pdfDoc?: PDFDocumentProxy;
pdfDownloaded: any;
@ViewChild('pdfViewer') pdfViewer!: NgxExtendedPdfViewerComponent;
constructor(private http: HttpClient, private ngZone: NgZone) {
}
ngOnInit(): void {
console.info('dfsd');
}
downloadPdf() {
// Get the PDF data from the PDF viewer
// @ts-ignore
const editedPdfData = this.pdfViewer?.getCurrentDocumentAsBlob();
// Create a Blob URL for the edited PDF data
const blob = new Blob([editedPdfData], { type: 'application/pdf' });
const url = URL.createObjectURL(blob);
// Create a download link
const link = document.createElement('a');
link.href = url;
link.download = 'edited-file.pdf'; // Specify the desired filename
// Append the link to the document, trigger the download, and then remove the link
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
// Revoke the Blob URL to free up memory
URL.revokeObjectURL(url);
}
}
не только это, я сделал так много попыток решить эту проблему, но так и не нашел решения.
Это решение возможно только для версий, равных или выше версии 7.
Добавить импорт
import { NgxExtendedPdfViewerService } from 'ngx-extended-pdf-viewer';
измените свой код здесь:
constructor( private http: HttpClient, private ngZone: NgZone, private ngxService: NgxExtendedPdfViewerService) { }
и здесь:
const editedPdfData = this.ngxService?.getCurrentDocumentAsBlob();
Как сейчас написано, ваш ответ неясен. Пожалуйста, отредактируйте , чтобы добавить дополнительную информацию, которая поможет другим понять, как это относится к заданному вопросу. Более подробную информацию о том, как писать хорошие ответы, вы можете найти в справочном центре.
Спасибо за Вашу поддержку. Я уже исправил это так же, как вы упомянули.
Эта функция доступна начиная с версии 7. В предыдущих версиях скачать файл можно было только с панели инструментов, загрузите файл. Если вам нужно, чтобы он был совместим с ie11. единственная версия, которая работает на 100%, использует версию «ngx-extended-pdf-viewer»: «5.3»,
Можете ли вы использовать правильный формат и синтаксис кода?