0

i want to know that how can i export pdf file from angularjs. I've exported excel file and it is working fine.

following is code for excel

view.html

<button ng-click="vm.exportData()" class="btn btn-info"><i class="glyphicon glyphicon-download"></i>&nbsp; Download as pdf</button>

controller.js

 $scope.exportData = function () {
        debugger;
        var blob = new Blob([document.getElementById('export').innerHTML], {
            type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8"
        });
        window.saveAs(blob, "Report.xls");
    },

how to do type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8" <======this linein pdf?

Thanks in advance :)

3
  • have u tried 'type': 'application/pdf' Commented Feb 2, 2016 at 6:28
  • Just as @CodingNinja said, 'type': 'application/pdf' should be work Commented Feb 2, 2016 at 6:29
  • Yes... i tried that, the file gets downloaded but gives the error "Failed to load pdf content" when i try to open it.. Commented Feb 2, 2016 at 6:30

1 Answer 1

0

Update:

You can retrieve the pdf content as ArrayBuffer by set responseType:

  $http({
                url: url,
                method: method,
                headers: {
                    'Content-type': _type
                },
                responseType: 'arraybuffer' //set response type
            })

Note:

type -> 'application/pdf'

fileContent -> should be an ArrayBuffer

downloadFile(filename, 'application/pdf', fileContent);

function downloadFile(filename, type, fileContent) {
    var blob = new Blob([fileContent], {type: type});
    if (navigator.msSaveBlob) { // IE 10+
        navigator.msSaveBlob(blob, filename);
    } else {
        var link = document.createElement('a');
        if (link.download !== undefined) { // feature detection
            // Browsers that support HTML5 download attribute
            var url = URL.createObjectURL(blob);
            link.setAttribute('href', url);
            link.setAttribute('download', filename);
            link.style.visibility = 'hidden';
            document.body.appendChild(link);
            link.click();
            document.body.removeChild(link);
        }
    }
}
Sign up to request clarification or add additional context in comments.

2 Comments

Well, m not sure where should i use the response type as "array buffer" because i have defined that function on a button click inside its controller and not calling it through any http link..
If you content isn't binary data from server, you can check this lib out:code.google.com/archive/p/jspdf

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.