如何将文件JSON导出为CSV或XLSX格式Angularjs

问题描述：

进出口新的angularjs和IM试图导出数据的xlsx格式，但我的数据是不来任何一个可以帮助我在这如何导出因为我已经解析了json数据csv，但是如果有的话仍然可以帮助它很容易，请让它在小提琴并发送给我，感谢提前。如何将文件JSON导出为CSV或XLSX格式Angularjs

<html ng-app="myApp"> 
<script src="https://rawgithub.com/eligrey/FileSaver.js/master/FileSaver.js" type="text/javascript"></script> 
    <script src="http://alasql.org/console/alasql.min.js"></script> 
    <script src="http://alasql.org/console/xlsx.core.min.js"></script> 
<button ng-click="exportData()" class="btn btn-primary" style="float:right;padding-right:10px;">Export&nbsp;&nbsp;<i class="fa fa-arrow-down"></i></button> 
</html>

js文件是

var app=angular.module('myApp',[]); 
app.controller('exportreportController', ['$stateParams','$rootScope', '$scope', '$state', '$location', 'dashboardService', 'Flash','$http','$timeout', 
function ($stateParams,$rootScope, $scope, $state, $location, dashboardService, Flash,$http,$timeout) { 

$scope.inverters = [ 
    { 
    "InvDetails": "UPS", 
    "LstRecords": [ 
     { 
     "Id": 1, 
     "Invertor_Id": 1, 
     "Time_of_Reading": "20170214", 
     "Lastreading": 0, 
     "Readingby": 0 
     }, 
     { 
     "Id": 87, 
     "Invertor_Id": 1, 
     "Time_of_Reading": "20170215", 
     "Lastreading": 5, 
     "Readingby": 10 
     }, 
     { 
     "Id": 110, 
     "Invertor_Id": 1, 
     "Time_of_Reading": "20170216", 
     "Lastreading": 10, 
     "Readingby": 92 
     }, 
     { 
     "Id": 111, 
     "Invertor_Id": 1, 
     "Time_of_Reading": "20170216", 
     "Lastreading": 92, 
     "Readingby": 95 
     } 
    ] 
    }, 
    { 
    "InvDetails": "Power Supply", 

    "LstRecords": [ 
     { 
     "Id": 2, 
     "Invertor_Id": 2, 
     "Time_of_Reading": "20170214", 
     "Lastreading": 0, 
     "Readingby": 0 
     }, 
     { 
     "Id": 88, 
     "Invertor_Id": 2, 
     "Time_of_Reading": "20170215", 
     "Lastreading": 7, 
     "Readingby": 13 
     }, 
     { 
     "Id": 109, 
     "Invertor_Id": 2, 
     "Time_of_Reading": "20170216", 
     "Lastreading": 13, 
     "Readingby": 25 
     }, 
     { 
     "Id": 112, 
     "Invertor_Id": 2, 
     "Time_of_Reading": "20170216", 
     "Lastreading": 25, 
     "Readingby": 49 
     } 
    ] 
    } 
]; 

    $scope.exportData = function() { 
     //alert("exporting"); 
     // var blob = new Blob([document.getElementById('example1').innerHTML], { 
     //  type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8" 
     // }); 
     // saveAs(blob, "Report.xls"); 
     var data=""; 
     $scope.headers=[]; 
     angular.forEach($scope.inverters,function(value,key){ 
// debugger 
     var we=value.InvDetails; 
     $scope.headers.push(we); 
     $scope.last=value.LstRecords; 
     angular.forEach($scope.last,function(value,key){ 

    data={ 
     "Id": value.Id, 
     "Invertor_Id": value.Invertor_Id, 
     "Time_of_Reading":value.Time_of_Reading, 
     "Lastreading": value.Lastreading, 
     "Readingby": value.Readingby 
     }; 
     }) 
    }) 

     $scope.result=[]; 
     $scope.result0=[]; 
     $scope.result.push({ 
     "Invertor1":JSON.stringify(data) 
     }) 
     // debugger 
     alasql('SELECT * INTO XLSX("john.xlsx",{headers:true}) FROM ?',[$scope.result]); 
    }; 
    }]);

我需要出口这一个CSV或XLSX，请帮我在这我已经在谷歌搜索，但我没有得到这个确切的解决方案。 ...请帮我一把。只是我想报告明智地导出数据，因为它是报告生成。

答

当我需要类似的东西时，ng-csv和其他解决方案并没有完全帮助。我的数据在$范围内，没有HTML表格显示它。因此，我构建了一个指令，使用Sheet.js（xslsx.js）和FileSaver.js将json数据导出到Excel。

Here is my solution packed.

例如，数据是：

$scope.jsonToExport = [ 
    { 
     "col1data": "1", 
     "col2data": "Fight Club", 
     "col3data": "Brad Pitt" 
    }, 
    { 
     "col1data": "2", 
     "col2data": "Matrix Series", 
     "col3data": "Keanu Reeves" 
    }, 
    { 
     "col1data": "3", 
     "col2data": "V for Vendetta", 
     "col3data": "Hugo Weaving" 
    } 
];

我不得不在我的控制器，用于我的指令准备数据数组的数组：

$scope.exportData = []; 
// Headers: 
$scope.exportData.push(["#", "Movie", "Actor"]); 
// Data: 
angular.forEach($scope.jsonToExport, function(value, key) { 
    $scope.exportData.push([value.col1data, value.col2data, value.col3data]); 
});

最后，添加指令到我的模板。它显示一个按钮。（见the fiddle）。

<div excel-export export-data="exportData" file-name="{{fileName}}"></div>

但我在嵌套的JSON数组fromat数据，我不无如何在CSV转换，因为即时通讯从昨天挣扎请让我知道如果u可以获取我的嵌套的数据会eacsy我感谢 – Rocker

请不要用我的JSON数据发送给我，这对我来说很简单，当我尝试即时获取错误时。我也谷歌搜索，但不是相似的嵌套json数组数据..请做这个josn，谢谢 – Rocker

你可以使用另一个'angular.forEach'里面我提供的答案。 _“我只能向你展示门，你是那个必须穿过它的人。”_ - [Morpheus]（http://www.quotes.net/mquote/60255） –

如何将文件JSON导出为CSV或XLSX格式Angularjs

相关推荐