0

我正在尝试从我的 Angular 4 应用程序中使用 FlowPaper Viewer。但我收到以下错误：

core.es5.js?de3d:1020 ERROR TypeError: $(...).FlowPaperViewer is not a function

  • 谁能帮我找出问题或给我一个替代解决方案，我可以在其中显示来自blob的pdf？

  • 或者可以向我推荐任何其他 pdf 查看器（具有漂亮外观和感觉的更好的阅读器），我可以在其中显示来自 blob 的 pdf？

我尝试如下（在 Jhipster Angular 4 应用程序中）：我已将 JS 和 CSS 文件手动包含在我的项目文件夹中，例如：

webapp/content/css/flowpaper.css
webapp/content/js/jquery.min.js
webapp/content/js/jquery.extensions.min.js
webapp/content/js/fpsmeter.min.js
webapp/content/js/three.min.js
webapp/content/js/flowpaper.js
webapp/content/js/flowpaper_handlers.js
webapp/content/js/FlowPaperViewer.js
webapp/content/js/flowpaper.worker.js

然后在 angular-cli.json 文件中添加引用，如下所示：

        "styles": [
            "content/css/vendor.css",
            "content/css/global.css",
            "content/css/flowpaper.css"
        ],
        "scripts": [
            "content/js/jquery.min.js",
            "content/js/jquery.extensions.min.js",
            "content/js/fpsmeter.min.js",
            "content/js/three.min.js",
            "content/js/flowpaper.js",
            "content/js/flowpaper_handlers.js",
            "content/js/FlowPaperViewer.js",
            "content/js/flowpaper.worker.js"
        ]

在 Html 文件中添加：

<div id="documentViewer" class="flowpaper_viewer" style="position:absolute;;width:100%;height:100%;background-color:#222222;;"></div>

在我声明 jquery 变量的组件中：

declare var $:any;

在接收 pdf blob 文件时，我调用了：

uint8Array  = new Uint8Array(arrayBuffer);
$('#documentViewer').FlowPaperViewer(
                        { config : {
                            PDFFile : uint8Array
                        }});

我在 chrome 控制台中看到：

core.es5.js?de3d:1020 ERROR TypeError: $(...).FlowPaperViewer is not a function

4

0 回答 0