Bug in downloading a text file in angular js

Question

I have download text file request from backend. I need to download the file by posting get request given in service.js but the problem is I am getting %7d %7d in blank when I am downloading the file. Need assistance.I even tried with ng-href, still no luck

HTML:

<button class="btn btn-info" ng-click="downloadAllExhibitors();">
<a href="{{newFile}}" target="_blank">Download</a></button>

JS:

    $scope.downloadAllExhibitors = function () {
    $scope.newFile = service.downloadExhibitor(); 
     }

Service.js

   var url =' http://localhost/1290/';
  function downloadExhibitor() {


            var token = 129821sahh;
            var auth = "Token" + ' ' + token;

            var config = {
                headers: {
                    'Content-Type': 'application/json',
                    'Authorization': auth
                }
            }

       return $http.get(url + 'entity/campaigns/download_exhibitors/', config);
        }

$http.get returns a Promise. Try service.downloadExhibitor().then((res) => {$scope.newFile = res.data;}). Also your %7d %7d are URL encoded }} — Aleksey Solovey
– Aleksey Solovey, Commented Apr 3, 2018 at 8:30
@AlekseySolovey if i give that way, I am getting response like this {"data":"id\tname\temail\tphone\twebsite\tvenue\ttags\n sunitha\[email protected]\t55555541\thttp://www.sunitha.com\n,"status":200,"config":{"method":"GET","transformRequest":[null],"transformResponse":[null],"jsonpCallbackParam":"callback","headers":{"Authorization":"Token 13946cc6c575d61b042b01b6905f1d239b3d9b08","Accept":"application/json, text/plain, /"},"url":"localhost/1290"},"statusText":"OK","xhrStatus":"complete"} — Nicoleta Wilskon
– Nicoleta Wilskon, Commented Apr 3, 2018 at 8:50
Why are you using application/json if it is a text file? Why are you setting the href attribute with {{ }} interpolation if the data is JSON? — georgeawg
– georgeawg, Commented Apr 3, 2018 at 15:14

manish · Accepted Answer · 2018-04-03 10:11:26Z

1

The problem with your code lies in $scope.newFile = service.downloadExhibitor(); Since $http.get is async and returns a promise, you can always define callbacks to handle the success/error response from server.

So, by the time your server returns the response you have no actions defined to handle it. Your service can be re-written as :-

var url =' http://localhost/1290/';
function downloadExhibitor() {

        var token = 129821sahh;
        var auth = "Token" + ' ' + token;

        var config = {
            headers: {
                'Content-Type': 'application/json',
                'Authorization': auth
            }
        }

        return $http.get(url + 'entity/campaigns/download_exhibitors/', config)
               .then(successHandler, errorHandler);
}

function successHandler(response){
    /* we've got file's data from server */
    return response.data;
}

function errorHandler(error){
    /* we've got error response from server */
    throw new Error('ERROR ' + error);
}

and eventually the service invocation

$scope.newFile = "";
service.downloadExhibitor()
       .then(function(data){
                $scope.newFile = data;
             }, function(error){ 
                console.log(error);
             });

edited Apr 3, 2018 at 10:11

answered Apr 3, 2018 at 9:02

manish

1,4588 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Nicoleta Wilskon Over a year ago

I tried same method. Still I am getting this error only Cannot GET /Organizer/idnameemailphonewebsitevenuetags83Any%[email protected]://www.anyname.comHall%20Atag1,%20tag2,%[email protected]://[email protected]://[email protected]://www.raichel.com

Collectives™ on Stack Overflow

Bug in downloading a text file in angular js

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related