Skip to main content

Features Overview

Most of what you reach for in a PDF viewer is a declarative input or output here. Point pdfSrc at a file and the component renders, navigates, searches, prints, and zooms with no extra wiring. The table below is the whole feature surface; each row links to a guide with runnable code.

PDF.js 6.x is bundled, and the component is built and tested on Angular 22 (peer range stays >=10).

Features

FeatureWhat it doesGuide
Annotation editing & eSignHighlight, text, draw, stamp, plus opt-in signature & comment editors. Save and restore with getAnnotations()/setAnnotations(); download with edits applied.Annotation editing
FormsTwo-way [(formData)] AcroForm binding, programmatic read/write, save filled documents.Forms
Searchsearch() with totals, per-page counts, and next/previous stepping.Search
Page organizationReorder, delete, extract, and merge pages in the viewer (opt-in).Page organization
AI assistant (your endpoint)Chat panel with clickable page citations against your OpenAI-compatible endpoint. The library makes no vendor calls of its own.AI assistant
Read aloudSentence-by-sentence text-to-speech with in-page highlighting.Read aloud
Custom toolbar, sidebar & overlaysReplace the viewer chrome with your Angular templates, project templates onto every page, or drop the chrome entirely with chromeless for an embedded pages-only view.Custom UI
Content protectionBlock print, download, and text selection; stamp watermarks. Client-side deterrence, not DRM.Content protection
Authenticated loadinghttpHeaders/withCredentials, download progress, password-prompt events.Loading documents
LocalizationLocale detection, RTL, and overridable UI strings via locale.Component inputs
Accessibility (WCAG/EAA)Screen-reader text layer, tagged-PDF structure, keyboard chrome, read-aloud.Accessibility
True dark pagesRe-render page content with custom colors via pageColors, not just the chrome.Theming
PDF.js options passthroughAllowlisted pdfJsOptions for init-time viewer preferences.Component inputs

How it's built

A few design choices worth knowing before you wire it up:

  • One action path, no polling. Every method call (go to page, set zoom, start read-aloud) is queued and runs once the viewer reports it's ready, so calls made before the PDF finishes loading don't get dropped or race the load. This replaced the timeout-based approach from v20.
  • Templates, not HTML strings. Loading spinners, error states, the toolbar, the sidebar, and per-page overlays are <ng-template>s you supply, so they keep your bindings and pass through Angular's sanitizer.
  • A typed surface. 30+ inputs, 24+ outputs, and 19+ Promise-returning methods, all typed. The API reference is the full list.
  • One same-origin iframe. The bundled PDF.js viewer runs in a sandboxed, same-origin iframe, and the host-to-viewer postMessage bridge checks event.source in both directions. See iframe security.

Theming

Pass a theme object, or drive it all with CSS variables:

themeConfig = { theme: 'dark', primaryColor: '#3f51b5', backgroundColor: '#1e1e1e', textColor: '#ffffff' };
:root {
--pdf-viewer-primary: #3f51b5;
--pdf-viewer-background: #ffffff;
--pdf-viewer-text: #333333;
}

Dark mode can re-render the page content itself, not just the toolbar, with pageColors. The theming guide has the full set.

Next