How can I get the name of the file I'm uploading


I’m using angular-file-uploader ( to upload files and it works fine, but I can’t find a way to get the filename, I want something like assign it to a variable so I can use to download it later.

I got a component with the following html template:


and TypeScript:

this.afuConfig = {
    uploadAPI: {

    //I want something like this..


You have to add a selector to the template called fileUpload1 for example:


In the TypeScript part of your component you add a ViewChild property to the class:

private fileUpload1: AngularFileUploaderComponent;

And finally you can get the file name in the DocUpload function like this:

DocUpload(res) {

The allowedFiles attribute is an array of all selected files. If you want the first one you have to use allowedFiles[0] and then read the name via the name attribute.

Answered By – Philipp Kief

Answer Checked By – Jay B. (AngularFixing Admin)

Leave a Reply

Your email address will not be published.