如何使用angularjs将数据导出到CSV和PDF文件 [英] how to export data into CSV and PDF files using angularjs

查看:129
本文介绍了如何使用angularjs将数据导出到CSV和PDF文件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想,当我单击按钮(CSV和PDF都分开)时,它会以正确的格式自动下载为CSV和PDF文件. 这个CSV代码我想在代码内部添加PDF

I want to, when i click on button (separate for both CSV and PDF), it automatically download in CSV and PDF file with correct Formatting. this CSV code i want to add PDF inside code

 $scope.downloadData = function() {
            var datasets = $scope.datasets.reverse();
            var file_name = $scope.m_id+ '.csv';
            var dataUrl = 'data:text/csv;charset=utf-8,';
            var json = [];
            if(datasets !== null) {
                for(idx = 0; idx < datasets.length; idx++) {
                    var dataset = datasets[idx].data;
                    var time = datasets[idx].timestamp;
                    time = $filter('date')(time, "dd/MMMM/yyyy-hh:mm a");
                    dataset.time = time;
                    json.push(dataset);
            }
                var fields = Object.keys(json[0]);
                var csv = json.map(
                            function(row) {
                                return fields.map(
                                    function(fieldName) {
                                        return '"' + (row[fieldName] || '') + '"';
                                    }
                                );
                            }
                        );

                csv.unshift(fields);

                var csv_str = csv.join('%0A');
                var downloadURL = dataUrl + csv_str;

                var saveAs = function(uri, filename) {
                    var link = document.createElement('a');
                    if (typeof link.download === 'string') {
                        document.body.appendChild(link); // Firefox requires the link to be in the body
                        link.download = filename;
                        link.href = uri;
                        link.target = "_blank";
                        link.click();
                        document.body.removeChild(link); // remove the link when done
                    } else {
                        location.replace(uri);
                    }
                };
                saveAs(downloadURL, file_name);
            } else {
               $scope.err_msg = 'Failed to get data. Try reloading the page.';
            }
        };

我尝试了一些我在Internet上找到的脚本,但是它不起作用,有些脚本存在格式问题,并且保存了下载. 预先谢谢.

I try some of script i found on internet, but it is not working, some have formatting issue and save have downloading. In Advance Thanks.

推荐答案

对于pdf/csv或其他格式,您应该使用这个很棒的库. file-saver"rel =" nofollow noreferrer>文件保护程序

You should use this awesome library for pdf/csv or whatever else formats.. File Saver

这是代码示例,该服务是使用FileSaver创建的

Here's is code example, service created using FileSaver

function download(api, file, contentType) {
    var d = $q.defer();
    $http({
        method: 'GET',
        url: api,
        responseType: 'arraybuffer',
        headers: {
            'Content-type': contentType
        }
    }).success(function(response) {
        var data = new Blob([response], {
            type: contentType+ ';charset=utf-8'
        });
        FileSaver.saveAs(data, file);
        d.resolve(response);
    }).error(function(response) {
        d.reject(response);
    });
    return d.promise;
}

file输入的是文件名,您可以使用相同的服务并直接从控制器传递类型和文件名.

file input is name of file, you can use same service and pass the types and file names direct from controller.

让我们为您提供服务的名称为homeService

Let;s you service name is homeService

用于pdf呼叫

homeservice.download('/api/download/whaever', 'export.pdf', 'application/pdf')

这篇关于如何使用angularjs将数据导出到CSV和PDF文件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆