• Getting Started
  • Components
    • Barcodes
    • Buttons
    • Chartsupdated
    • Conversational UIupdated
    • Data Query
    • Date Inputsupdated
    • Date Math
    • Dialogs
    • Drawing
    • Dropdownsupdated
    • Editor
    • Excel Export
    • File Saver
    • Filter
    • Gantt
    • Gauges
    • Gridupdated
    • Icons
    • Indicators
    • Inputsupdated
    • Labels
    • Layout
    • ListBox
    • ListView
    • Map
    • Menus
    • Navigation
    • Notification
    • Pager
    • PDF Export
    • PDFViewer
    • PivotGridupdated
    • Popup
    • ProgressBars
    • Ripple
    • Schedulerupdated
    • ScrollView
    • Sortable
    • Spreadsheetupdated
    • ToolBar
    • Tooltips
    • TreeList
    • TreeView
    • Typography
    • Uploads
    • Utilities
  • Styling & Themes
  • Common Features
  • Project Setup
  • Knowledge Base
  • Sample Applications
  • FAQ
  • Troubleshooting
  • Updates
  • Changelogs
New to Kendo UI for Angular? Start a free 30-day trial

Angular PDFViewer Data-Binding

The PDFViewer component is a powerful tool that enables you to display PDF files within a web browser from various data types.

The component support the following types of data:

Setting more than one source of data simultaneously is not supported. In case the PDFViewer must support several data types, consider setting the one that is not being used to undefined.

Using URL String

The PDFViewer component allows you to display PDF files directly within a web browser using a URL string. All you need to do is to set the url property to the corresponding URL string.

The following example demonstrates how to load a PDF file from an URL string.

Example
View Source
Change Theme:

Using Base64 String

To display a PDF file in the browser from a Base64 format string, set the data property of the component to the necessary string.

The following example demonstrates how to load a PDF file from a Base64 string.

Example
View Source
Change Theme:

Using ArrayBuffer Object

To display a PDF file in the browser from a raw binary data buffer object, set the arrayBuffer property.

<kendo-pdfviewer [arrayBuffer]="arrayBufferData"> </kendo-pdfviewer>

Using TypedArray Object

To display a PDF file in the browser from a TypedArray object, set the typedArray property.

<kendo-pdfviewer [typedArray]="typedArrayrData"> </kendo-pdfviewer>

Known Limitations

  • The 1.5 PDF specification limits the maximum PDF document size to 5,080 x 5,080 millimeters (which equals to 200x200 inches). Larger files might not open.