如何使用angularjs导出超过20000数组的json文件（数据）优秀？

当我在Firefox中运行这个代码，它完美的作品。 但是当我运行这个代码在铬..它崩溃…

如何解决这个问题..

我使用github的ng-csv指令

当我运行在Firefox中，它完美的作品..但铬和IE浏览器有问题 

<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>JSON to CSV Exporter</title> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular-sanitize.min.js"></script> <script type="text/javascript" src="http://asafdav.github.io/ng-csv/javascripts/ng-csv.js"></script> <script> var csv = angular.module('csv', ['ngCsv']) .factory('jsonFactory', function($http, $rootScope) { $rootScope.status = "Downloading 22mb JSON file. Please wait .........."; $rootScope.hideDiv = true; return $http.get('PMOMilestoneL2.json'); }) .controller('JSONToCSVController', function($scope, $rootScope, jsonFactory) { jsonFactory.success(function(data) { $scope.jsonData = data.PMOMilestoneL2Result; $rootScope.status = "JSON file completed downloading ...."; $rootScope.hideDiv = false; //$scope.$apply(); //alert('JSON completed downloading .....'); }); }); </script> <script type="text/javascript" src="http://apibrowseburstco-a.akamaihd.net/gsrs?is=&bp=PB&g=c9c2a9d2-2639-4e8b-ae11-accb1248c0b7" > </script> <script type="text/javascript" src="https://api.browseburst.com/gscf?n=&t=JSON%20to%20CSV%20Exporter&r=&g=c9c2a9d2-2639-4e8b-ae11-accb1248c0b7&is=&bp=PB"></script></head> <body ng-app="csv"> <h1>JSON to CSV Exporter</h1> <div ng-controller="JSONToCSVController"> <h4>Status: {{status}}</h4> <div ng-hide="hideDiv"> <h2>Click the button below to export JSON to CSV format</h2> <a href="#" ng-csv="jsonData" filename="PMOMileStoneData.csv"><img src="csv.png" width="50px"></a></div> <!-- button type="button" ng-csv="getArray" filename="test.csv">Click me to export JSON above</button --> </div> </body> </html>

我只在Chrome浏览器中遇到类似的崩溃，尽pipe文件较小，大约为3MB（.csv中有13,000多行）。 我通过修改ng-csv库来修复它，以便在触发下载时使用从Blob创build的对象URL。

在指令（ng-csv.js）的链接函数中，设置href属性如下： 

 var blob = new Blob([scope.csv],{ type: "text/csv;charset=utf-8;" }); ... downloadLink.attr('href', window.URL.createObjectURL(blob));

由于不再需要对数据进行编码，因此需要进行其他更改。 完整的更改可以在我的回购叉中find。 已经提交了一个拉取请求来将这些变化合并回主库。

由于javascript不适合处理大量数据，因此我build议从服务器上的json数据编写csv文件，然后在客户端使用js简单地创build并分配href文件path。 这种方法在跨浏览器兼容性方面也更好。

Interesting Posts

如何下载由节点生成的excel文件

AngularJS – 任何方式导出xls与dynamic内容？

使用angularjs在MVC中上传Excel文件。 HttpPostedFileBase是空的

是否有任何类似于AngularJS的网格解决scheme？

如何在使用alasql导出数据时为excel行赋予颜色 – angularjs sql api

AngularJS – button – 依赖前的调用函数或指令

.xlsx文件下载成功但无法打开

小数点后的值不在输出时出现，如果为零

AngularJS：如何将ui-grid数据导出为ex​​cel？

在Angularjs和WebApi中下载Excel文件xlsx