如何在AngularJS中连接jsReport？

Question

我现在有一个关于JSReport的问题..它假设我已经有了一个API ...我现在想要的是如何将它与我使用AngularJS的客户端链接.

如果我使用Postman,它将返回一个我想要的pdf文件.但我的问题是当我使用angularjs发布它时如何显示它是我的页面..

我有这样的代码:

调节器

$scope.Print = function () {
        authService.print().then(function(result){
            var _result = result;
        });
    };

服务

var _print = function () {
        var data = { "template": { "shortid": "byQtwHLPQ" } };
        return $http.post("http://192.168.8.87/api/report", data).then(function (result) {
            return result;
        });
    };

authServiceFactory.print = _print;

现在我有了这个代码并且它不起作用......我认为它没有返回所以我删除了返回并且只是发布但是它仍然没有用,甚至下载pdf也没有用.

有人可以帮忙吗...

Answer 1

像这样使用..

控制器

var parameter = { "template": { "shortid": "ZkMoslfdX" }};
        PrintService.Print(parameter).then(function (result) {
            var file = new Blob([result.data], { type: 'application/pdf' });
            var fileURL = URL.createObjectURL(file);
            $scope.content = $sce.trustAsResourceUrl(fileURL);
        });

服务

var reportUrl = "http://192.168.8.87/api/report";
    var _print = function (parameter) {
        return $http.post(reportUrl, parameter, { responseType: 'arraybuffer' }).success(function (response) {
            return response;
        });
    };

主要思想是将result.data转换为 blob 并创建一个 ，objectURL以便它可读并且适合标签object并$sce.trustAsResourceUrl用于信任角度到您的URL

超文本标记语言

<object data="{{content}}" type="application/pdf" style="width:100%;height:80%"></object>

我参考这篇文章AngularJS：在 Angular 应用程序中显示 blob (.pdf)以进行澄清，只需阅读该文章即可。