diff --git a/src/angular-pdf.directive.js b/src/angular-pdf.directive.js
index 077266c..5fd1b5a 100644
--- a/src/angular-pdf.directive.js
+++ b/src/angular-pdf.directive.js
@@ -37,6 +37,7 @@ export const NgPdf = ($window, $document, $log) => {
let renderTask = null;
let pdfLoaderTask = null;
let debug = false;
+ let canvas = null;
let url = scope.pdfUrl;
let httpHeaders = scope.httpHeaders;
let pdfDoc = null;
@@ -44,7 +45,12 @@ export const NgPdf = ($window, $document, $log) => {
let pageFit = attrs.scale === 'page-fit';
let limitHeight = attrs.limitcanvasheight === '1';
let scale = attrs.scale > 0 ? attrs.scale : 1;
- let canvas = $document[0].createElement('canvas');
+
+ if (attrs.hasOwnProperty('canvasid')) {
+ canvas = $document[0].getElementById(attrs.canvasid);
+ } else {
+ canvas = $document[0].createElement('canvas');
+ }
initCanvas(element, canvas);
let creds = attrs.usecredentials;
debug = attrs.hasOwnProperty('debug') ? attrs.debug : false;
diff --git a/test/spec/ngPdfSpec.js b/test/spec/ngPdfSpec.js
index 1c8dd0a..c38c5a7 100644
--- a/test/spec/ngPdfSpec.js
+++ b/test/spec/ngPdfSpec.js
@@ -14,7 +14,7 @@ describe('ngPdf', function() {
var $document = _$document_;
$scope = $rootScope.$new();
// Compile a piece of HTML containing the directive
- var html = '';
+ var html = '';
var elmnt = angular.element(html);
$document.find('body').append(elmnt);
element = $compile(elmnt)($scope);
@@ -70,7 +70,7 @@ describe('ngPdf protected', function() {
var $document = _$document_;
$scope = $rootScope.$new();
// Compile a piece of HTML containing the directive
- var html = '';
+ var html = '';
var elmnt = angular.element(html);
$document.find('body').append(elmnt);
element = $compile(elmnt)($scope);