How do I use events?
600
<ejs-pdfviewer
id="pdfViewer"
[serviceUrl]="service"
[documentPath]="document"
(addSignature)="addSignature($event)"
(annotationAdd)="annotationAdd($event)"
(commentAdd)="commentAdd($event)"
(ajaxRequestfailed)="ajaxRequestFailed($event)"
(documentLoadFailed)="documentLoadFailed($event)"
style="height:640px;display:block"
></ejs-pdfviewer>
//Triggers while adding the signature
addSignature(args) {
console.log("Signature is added”);
}
//Triggers while adding the annotations
annotationAdd(args) {
console.log("annotationis added”);
}
//Triggers while adding the comments
commentAdd(args) {
console.log("Comment is added”);
}
//Triggers while ajax request gets failed
ajaxRequestFailed(args) {
console.log("Ajax request gets failed”);
}
//Triggers while document load gets failed
documentLoadFailed(args) {
console.log(“Document load gets failed”);
}
|
Our problem is that we need to instance two copies or more of the pdf viewer in the same browser tab, because our webapp has a tabbed interface, which allows users to open two documents in the same browser tab. Right now this is not possible, it seems that there is an internal state of the pdf viewer that does not allow it. Could you give me a solution?
I have tried the solution you propose, I have generated a random id for the pdf viewer, but when I instantiate it for the first time I have this error. I use Angular 6 in case it helps you information.
<ejs-pdfviewer
[id]="pdfViewerId"
#pdfviewer
[serviceUrl]="service"
[documentPath]="document"
(created)="created()"
style="height:640px;display:block"
></ejs-pdfviewer>
ngOnInit(): void {
// ngOnInit function
this.pdfViewerId = 'pdfViewer' + Math.floor(Math.random() * 10).toString();
}
created() {
console.log('created', new Date());
var viewer = (<any>document.getElementById(this.pdfViewerId))
.ej2_instances[0];
console.log(viewer);
}
|
Thanks to your contribution I have been able to make the viewer work in two tabs simultaneously, but I have a style problem when opening a second instance.
It seems that the problem lies in the template of the input inside the toptoolbar. In the first instance it works correctly but in the second the input styles are broken.
The input which breaks the style is the one generated by means of a template as I show in the images below.
We have already solved the problem, thanks!