CODEWITHSUNDEEP
angularjs
Soumya
Soumya

Reputation: 1913

Allow download of word document file in angular js

I have an application which allows uploading of documents like .pdf, .png, .jp(e)g, .doc and .docx as shown below

   <button type="button" ngf-select class="btn btn-warning btn-block"
           ngf-change="vm.setCv($file, vm.person)">
                Add Doc
   </button>

    vm.setCv = function ($file, person) {
        if ($file) {
            DataUtils.toBase64($file, function(base64Data) {
                $scope.$apply(function() {
                    person.cv = base64Data;
                    person.cvContentType = $file.type;
                });
            });
        }
    };

These documents are stored in the form of byte array (byte[]) in the database.

Now I want to provide a link which will let someone open or download the file.

<a ng-click="vm.openFile(vm.person.cvContentType, vm.person.cv)">open</a>

function openFile (type, data) {
    $window.open('data:' + type + ';base64,' + data, '_blank', 'height=300,width=400');
}

The above function works for pdf and image files but not for doc and docx files.

My question is how can I modify this code so that even if the browser is not allowing or is unable to open the .doc and .docx file, it will at least allow downloading of the file in correct format.

Upvotes: 0

Views: 3403

Answers (1)

Aravinthan K
Aravinthan K

Reputation: 1861

Convert your data to blob and assign to a tag. It will download all types of files. This solution works for me !! Convert your base64 to blob here

 var myBlob = new Blob([data],{type:type})
 var blobURL = (window.URL || window.webkitURL).createObjectURL(myBlob);
 var anchor = document.createElement("a");
 anchor.download = fileName;      // Downlaod File Name
 anchor.href = blobURL;
 anchor.click();

Upvotes: 1

Related Questions