Angular在浏览器上下载csv文件

Question

I have Rest API that sends the csv String like

"aa,bb\n cc,dd"

Here is the Rest Service code:

@GET
    @Path("/getCsv")
    @Produces({"text/csv"})
    public String getCSV(   ) {
        return "aa,ba,\n,ac,da";    
    }

On UI side

Angular resource code to make get request code is as below:

angular.module('csvHelper', ['ngResource','configuration']).factory('csvHelper', function($resource,$rootScope){
            return $resource(URL+'/api/getCsv/', {}, { 
                query: {method:'GET', params:{}, cache :true}
            });
            });

Code that makes get request and generate csv is as follows

csvHelper.query({}, function(response) {
                 def.resolve(response);  
                 },function(response) {
                 def.reject(response);  
                 });

           var prom = def.promise;
            prom.then(function(text) {              
                $window.open("data:text/csv;charset=utf-8," + encodeURIComponent(text));            
            }, function(error) {
                    console.log('promise failed', error);
            });

In network tab I see rest API sending the data properly:

   "aa,ba,\n,ac,da"

But when I download the csv file, inside it I see

[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

What am I doing wrong.

EDIT

I tired to print response on console and this is what I saw:

[e { 0="a",  $get=function(),  $save=function(),  more...}, e { 0="a",  $get=function(),  $save=function(),  more...}, e { 0=",",  $get=function(),  $save=function(),  more...}, e { 0="b",  $get=function(),  $save=function(),  more...}, e { 0="a",  $get=function(),  $save=function(),  more...}, e { 0=",",  $get=function(),  $save=function(),  more...}, e { 0="\n",  $get=function(),  $save=function(),  more...}, e { 0=",",  $get=function(),  $save=function(),  more...}, e { 0="a",  $get=function(),  $save=function(),  more...}, e { 0="c",  $get=function(),  $save=function(),  more...}, e { 0=",",  $get=function(),  $save=function(),  more...}, e { 0="d",  $get=function(),  $save=function(),  more...}, e { 0="a",  $get=function(),  $save=function(),  more...}]

EDIT 2

I changed the logic to use $http like this:

$http.get("http://myurl.com/api/getcsv")
              .success(function (response) {console.log(success)});

I see the success printed on console but I don't see popup.

when I hit http://myurl.com/api/getcsv in browser I see popup to download file.

What am I missing

EDIT 3

This change worked.

 $http.get(compiledUrl).then(function (response) {               
                          $window.open("data:text/csv;charset=utf-8," + encodeURIComponent(response.data));                             
                  },function(response){
                      console.log("error");                  
                  });   

Answer 1

If you just want to download the CSV string, you should use $http and not $resource.

$resource returns: A resource "class" object with methods for the default set of resource actions optionally extended with custom actions.

$resource @ angularjs.org

Answer 2

you can use two custom function

1

function JSONToCSVConvertor(JSONData,ShowLabel) {    
  var arrData = typeof JSONData != 'object' ? JSON.parse(JSONData) : 
SONData;   
 var CSV = '';       
if (ShowLabel) {     
var row = "";
 for (var index in arrData[0]) {
     row += index + ',';
 }
 row = row.slice(0, -1);
 CSV += row + '\r\n';
  }
  for (var i = 0; i < arrData.length; i++) {
 var row = "";
 for (var index in arrData[i]) {
    var arrValue = arrData[i][index] == null ? "" : '="' + arrData[i][index] + '"';
    row += arrValue + ',';
 }
 row.slice(0, row.length - 1);
 CSV += row + '\r\n';
  }
  if (CSV == '') {        
 growl.error("Invalid data");
 return;
  }   
  var fileName = "Result";
  if(msieversion()){
  var IEwindow = window.open();
  IEwindow.document.write('sep=,\r\n' + CSV);
  IEwindow.document.close();
  IEwindow.document.execCommand('SaveAs', true, fileName + ".csv");
  IEwindow.close();
  } else {
   var uri = 'data:application/csv;charset=utf-8,' + escape(CSV);
   var link = document.createElement("a");  
   link.href = uri;
   link.style = "visibility:hidden";
   link.download = fileName + ".csv";
   document.body.appendChild(link);
  link.click();
   document.body.removeChild(link);
 }
}

2

function msieversion() {
  var ua = window.navigator.userAgent; 
  var msie = ua.indexOf("MSIE "); 
  if (msie != -1 || !!navigator.userAgent.match(/Trident.*rv\:11\./)) // If Internet Explorer, return version number 
  {
return true;
  } else { // If another browser, 
   return false;
  }    
return false; 
}

and use above function to have downloadable result.csv file

  if(data.userlog == '')
            return;
        JSONToCSVConvertor(data.userlog, true);