We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

How to disable annotations in Syncfusion Angular PDFViewer component?


I am using the Syncfusion Angular PDFViewer component in my Angular application, and I need to disable the annotations that are imported into the viewer using the viewer.importAnnotation() method. I have tried setting the isLock property to true in the annotationSettings object, but it does not seem to work.

Here's an example of my code:

import { PdfViewerComponent } from '@syncfusion/ej2-angular-pdfviewer';

@Component({ // ...other component settings... }) export class MyComponent implements OnInit { // ...other properties... annotationSettings = { isLock: true }; // ...other methods... importAnnotations(): void { var viewer = (<any>document.getElementById('pdfViewer')).ej2_instances[0] as PdfViewerComponent; const _this = this; viewer.importAnnotation(JSON.parse(_this.exportObject)); } // ...other methods... }

Is there a way to disable annotations in the PDFViewer component after importing them using the viewer.importAnnotation() method? Any help or guidance on this would be greatly appreciated. Thank you in advance.

1 Reply 1 reply marked as answer

VV Visvesvar Venkatesan Syncfusion Team March 20, 2023 12:35 PM UTC

We have provided a code snippet to lock the annotations below.

Code Snippet:

for (var i = 0i < viewer.annotationCollection.lengthi++) {

      viewer.annotationCollection[i].annotationSettings.isLock = true;





You can place this code inside the import annotation method and the annotation gets locked while importing annotation.

Sample: https://stackblitz.com/edit/angular-q979qu?file=src%2Fapp.component.html,src%2Fapp.component.ts

Kindly try this and let us know if you have any concerns.

Marked as answer
Live Chat Icon For mobile
Up arrow icon