How to Open or Hide the Bookmark Pane in Angular PDF Viewer
14 Aug 20261 minute to read
The PDF Viewer exposes APIs to open and close the bookmark pane programmatically. Use openBookmarkPane() and closeBookmarkPane() to control the bookmark pane from application code.
Follow these steps to call the bookmark APIs from the application.
Step 1: Create a basic PDF Viewer sample using the getting started guide.
Step 2: Insert the following code snippet to implement opening the bookmark pane:
<button (click)="openBookmark()">Open Bookmark Pane</button>openBookmark() {
var viewer = (<any>document.getElementById('pdfViewer')).ej2_instances[0];
// Open Bookmark pane.
viewer.bookmarkViewModule.openBookmarkPane();
}Similarly, to close the bookmark pane programmatically, use the following code snippet:
<button (click)="closeBookmark()">Close Bookmark Pane</button>closeBookmark() {
var viewer = (<any>document.getElementById('pdfViewer')).ej2_instances[0];
// Close Bookmark pane.
viewer.bookmarkViewModule.closeBookmarkPane();
}