将数据内容保存到csv - AngularJS

时间:2014-11-27 05:47:07

标签: angularjs csv

您好我正在尝试将来自我的网络服务器的数据内容保存到csv文件中。

我正在尝试使用stackoverflow中来自各种问题的代码。

.success(function(data, status, headers, config) {
    console.log(data);
    if (data.success) {
        console.log(data);
        var saving = document.createElement('a');

        saving.href = 'data:attachment/csv,' + encodeURIComponent(data);
        saving.download = 'Summary.csv';
        saving.click();
    }
})
.error(function(data, status, headers, config) {
    console.log('error in downloading!');

});

但是数据内容没有保存到我的summary.csv并且给了我这个 [object object]。有人可以帮我这个吗?

3 个答案:

答案 0 :(得分:3)

第一个问题是encodeURIComponent()需要一个字符串,并且你给它一个对象,因此它会调用.toString(),这就是你获得[object Object]的原因。

相反,您需要自己将数据数组转换为CSV字符串。如果您使用D3.js,则可以使用d3.csv.format(rows),这非常好。或者你可以找到另一个JS CSV库。或者您可以使用我刚刚为您编写的以下非常简单的实现:

function csv(arr) {
    var ret = [];
    ret.push('"' + Object.keys(arr[0]).join('","') + '"');
    for (var i = 0, len = arr.length; i < len; i++) {
        var line = [];
        for (var key in arr[i]) {
            if (arr[i].hasOwnProperty(key)) {
                line.push('"' + arr[i][key] + '"');
            }
        }
        ret.push(line.join(','));
    }
    return ret.join('\n');
}
  

NB:此函数假定您传递一个包含至少一个元素的有效数组,并且所有元素都是完全相同键的对象。如果这些假设都不适合您,请扩展我的功能或使用更强大的第三方库。

所以,把这一切放在一起,你的最终代码将是:

.success(function(data, status, headers, config) {
    console.log(data);
    if (data.success) {
        console.log(data);
        var saving = document.createElement('a');

        saving.href = 'data:attachment/csv,' + encodeURIComponent(csv(data.results));
        saving.download = 'Summary.csv';
        saving.click();
    }
})
.error(function(data, status, headers, config) {
    console.log('error in downloading!');
});

请注意,我需要访问data.results才能获得实际的结果数组。我假设您将使用我的csv()函数或其他类似函数将数组转换为CSV字符串。

答案 1 :(得分:0)

添加附加保存以在firefox中工作!!

... // as is written
saving.download = 'Summary.csv';
document.body.appendChild(saving);
saving.click();

答案 2 :(得分:0)

使用 ng-csv

<button type="button" ng-csv="ExportCsv()" filename="ExportCsv.csv" csv-header="['a','b']" charset="utf-8">CSV</button>
$scope.ExportCsv= async function(){
  const msg = await getdata();
  return msg;
}
var getdata =  function abc(a,b) {
  return new Promise(resolve => {
    $http.get(// use backend)
          .success(function (data, status, headers, config) {
             $scope.datacsv =[];angular.forEach($scope.dt, function (value,key) {
             $scope.datacsv.push({"a":value.a,"b":value.b});
                           
          });
                
      })
    setTimeout(() => {
                    resolve($scope.datacsv);
    }, 2000);
  });
}