anglejs pdfビューア

Question

pdfだけでなく画像も可能なメニューを表示したい。

私はこれを達成するためにng-pdfviewerを使用しています。私のコントローラのコードは::

venueApp.controller('venueController',['$scope',PDFViewerService',function($scope,pdf){ 
    $scope.viewer = pdf.Instance("viewer"); 
    $scope.pageLoaded = function(curPage, totalPages) { 
    $scope.currentPage = curPage; 
    $scope.totalPages = totalPages; 
    }; 
    $scope.nextPage = function() { 
    $scope.viewer.nextPage(); 
    }; 

    $scope.prevPage = function() { 
     $scope.viewer.prevPage(); 
    }; 
}]); 

で、私のhtmlコードは、私はそれが構成されたので、私は表現evalutaionのために{[]}使用しています::

<a id="image_{[ menu.id ]}" ng-if="menu.filename.indexOf('.pdf') > -1"> 
    <button ng-click="prevPage()">&lt;</button> 
    <button ng-click="nextPage()">&gt;</button> 
    <br> 
    <span>{[currentPage]}/{[totalPages]}</span> 
    <br> 
    <pdfviewer src="{[menu.menu_url]}" on-page-load='pageLoaded(page,total)' id="viewer"></pdfviewer> 
</a> 

です。今私のコンソールでは、プラグインは私が

src属性が変更され、このプラグインで、コンソールに印刷

を推測正しいメッセージを出力している、新しい値が https://d1hpn7r5i0azx7.cloudfront.net/uploads/menu/18/ankush.pdf

loadPDF https://d1hpn7r5i0azx7.cloudfront.net/uploads/menu/18/ankush.pdf

警告は次のようになります。廃止されたAPIの使用：pdfDataRangeTransport、passwordCallbackまたはprogressCallback引数でgetDocumentが呼び出されました。

しかし、pdfはペイントされていません。 padfビューアタグのための私のDOM要素がある::

<pdfviewer src="https://d1hpn7r5i0azx7.cloudfront.net/uploads/menu/18/ankush.pdf" on-page-load="pageLoaded(page,total)" id="viewer" class="ng-isolate-scope"><canvas></canvas></pdfviewer> 

私は問題が何であるかを理解しません。たぶんそれはクロムもそれを表示しない代わりにダウンロードするだけで、それはPDFファイルと一緒です。サンプルPDFファイルへのリンクは::

https://d1hpn7r5i0azx7.cloudfront.net/uploads/menu/18/ankush.pdf

である私は真剣にそれをして何かをしなければならないと思うので、また、私はSOだけではなく、githubのプラグインのページでそれを投稿するには、この質問を投稿しています代わりにpdfファイルをプラグインしてください。それは私の履歴書ではありません

P.S、私たちの会社では応募者のプールから1を取った：P

Answer 1

私は角とオフラインのpdfのためhttp://viewerjs.org/を使用しています。しかし、ここでは、あなたはオンラインのPDFパスがあるようです。では、なぜGoogleドキュメントビューアを試していないのですか？オンライン文書には最適です。あなたがあなたのパスとURLのパラメータを変更する必要が https://docs.google.com/gview?url=http://infolab.stanford.edu/pub/papers/google.pdf ：

次のリンクをご覧ください。

また、あなたは、次のようIFRAMEであなたのウェブサイトでこのリンクを使用することができます。

<iframe src="http://docs.google.com/gview?url=http://infolab.stanford.edu/pub/papers/google.pdf&embedded=true" style="width:600px; height:500px;" frameborder="0"></iframe>