Javascript Angular.js从json数据生成csv文件

我正在尝试使用Angular.js从json数据生成csv文件

当我从服务器获取数据时，用户会在表中看到它，并可以对数据使用各种过滤器。当用户根据需要对其进行筛选时，我希望他们能够创建csv报告

而不是将筛选器发送回服务器以生成文件。我想直接从角度的过滤数据来做

现在，我有这个：

$scope.getReport = ->
      filteredItems = $filter('filter')($scope.records, $scope.query)
      filteredItems = $filter('orderBy')(filteredItems, $scope.tableSort.getOrderProp())

      csvRows = []
      csvRows.push('Title,Assigned ID,Last Name,First Name,Start Date,Complete Date,Page,Test Progress,Certificate')

      csvRows.push("#{record.course.title},#{record.course.assigned_id},#{record.user.last},#{record.user.first},#{record.start_date},#{record.complete_date},#{record.page},#{record.test_progress},#{record.get_cert}") for record in filteredItems
      csvString = csvRows.join("\r\n");

      report = document.createElement('a')
      angular.element(report)
        .attr('href', 'data:application/csv;charset=utf-8,' + encodeURI csvString)
        .attr('download', 'report.csv')
      console.log(report)
      document.body.appendChild(report);
      report.click();

这有点凌乱，但在Firefox和Chrome中似乎都能正常工作。我需要的东西，将在IE9+以及工作

我正在考虑的另一个选择是，使用表单并将json数据发送到服务器，但我不知道该怎么做。然后我可以让服务器用CSV文件响应。我这里的问题是，我不知道如何在不使用Ajax的情况下将json数据发送到服务器，因为Ajax不会下载返回的文件

更新 我不认为这是最好的方法，但我正在使用我的两种解决方案的组合。我让javascript创建如上所述的CSV。然后，当我提交表单时，它会添加“csvString”作为隐藏表单输入的值。数据将发送到服务器，服务器只会响应csv文件

更新2

---

同样，这种方法似乎在IE中不起作用。

IE还不支持

下载

属性。它属于HTML5规范，因此很可能在较新的IE版本中出现

要支持IE，您需要使用一些“变通方法”（例如向服务器发出请求[在对REST API的请求上使用

text/csv

MIME类型作为

Accept

头会非常聪明]，或者可能使用一些flash插件）

您可以使用：

使用Bower安装：

bower install ng-csv

将ng-csv.min.js添加到主文件（index.html），同时确保添加的是angular-sanitize.min.js

将ngCsv设置为模块中的依赖项

var myapp = angular.module('myapp', ['ngSanitize', 'ngCsv'])

将ng csv指令添加到所需元素，例如：

<button type="button" ng-csv="getArray()" filename="test.csv">Export</button>

导出