我需要在Angular中打開PDF,我嘗試過使用pdf.js和pdf.combined.js指令,但無法顯示數據。 My Angular ver - 1.4.8
由於它不應該有可下載的按鈕或PDF URL visible.So我不能使用谷歌文檔查看器或直接打開它作爲BLOB對象。
有人可以幫助我解決這個問題,對不起有點冗長,但任何幫助表示讚賞,謝謝!
pdf指令沒有在Angular JS中顯示pdf文件
代碼 -
vm.getCallRates = function() {
ModalService.showModal({
templateUrl: absoluteURL('app/profile/tariff.html'),
inputs: {},
controller: 'tariffController'
});
}
2)tariff.html具有NG-PDF和控制器這樣一個div - -
1),其具有方法打開上點擊一個模式窗口第一控制器
<div ng-controller="tariffController">
<ng-pdf template-url="app/profile/pdfViewer.html" canvasid="pdf-canvas"
scale="1.5" ></ng-pdf>
</div>
3)tariffController -
(function() {
'use strict';
angular
.module('app.profile')
.controller('tariffController', tariffController);
tariffController.$inject = ['$scope'];
function tariffController($scope) {
$scope.pdfUrl = "http://172.16.23.26:3123/images/Invoice.pdf";
//$scope.pdfName = 'Relativity: The Special and General Theory by Albert Einstein';
//$scope.pdfPassword = 'test';
$scope.scroll = 0;
$scope.loading = 'loading';
$scope.getNavStyle = function(scroll) {
if(scroll > 100) return 'pdf-controls fixed';
else return 'pdf-controls';
}
$scope.onError = function(error) {
console.log(error);
}
$scope.onLoad = function() {
$scope.loading = '';
}
$scope.onProgress = function (progressData) {
console.log(progressData);
};
$scope.onPassword = function (updatePasswordFn, passwordResponse) {
if (passwordResponse === PDFJS.PasswordResponses.NEED_PASSWORD) {
updatePasswordFn($scope.pdfPassword);
} else if (passwordResponse === PDFJS.PasswordResponses.INCORRECT_PASSWORD) {
console.log('Incorrect password')
}
};
}
}());
4)pdfViewer.html -
<nav ng-class="getNavStyle(scroll)">
<button ng-click="goPrevious()"><span><</span></button>
<button ng-click="goNext()"><span>></span></button>
<button ng-click="zoomIn()"><span>+</span></button>
<button ng-click="fit()"><span>100%</span></button>
<button ng-click="zoomOut()"><span>-</span></button>
<button ng-click="rotate()"><span>90</span></button>
<span>Page: </span>
<input type="text" min=1 ng-model="pageNum">
<span>/{{pageCount}}</span>
<span>Document URL: </span>
<input type="text" ng-model="pdfUrl">
</nav>
<hr>
{{loading}}
<canvas id="pdf-canvas"></canvas>
而且 「PDF」 依賴錯誤出現在瀏覽器刷新,但不能在第一裝載 -