lukasmarx / angular-file-upload

Creating a File Upload Component in Angular

Angular version: 8.0.0

Creating file-upload components can be quite hard.

Not only because you need to deal with files in JavaScript. Also, because you need an API to test against before you can actually start coding.

In this tutorial, we will learn how to do both.

First, we will create a simple express server with just one route to accept file uploads.

Afterward, we will create an angular application from scratch and build a beautiful file-upload component using the angular material ui-component-library.

Here is what the final result will look like:

Ready?

Let's start coding!

Read the full article at malcoded.com!

angular-file-upload's Issues

error on ng serve

after cloning and running npm install, when i use ng serve i receive this error:
ERROR in node_modules/@angular/flex-layout/core/typings/observable-media/observable-media.d.ts(1,22): error TS2305: Module '"/Users/nik/Documents/GitHub/angular-file-upload/client/node_modules/rxjs/Rx"' has no exported member 'Subscribable'.

Any idea why?

Thank you

@fabiomartino @LukasMarx ,

Very helpful resource!

How to abort the file upload progress once started

Hello,

I was trying to upload a big file. It will take more time to upload, so want to abort the upload progress. How do I cancel the upload request to abort file upload operation?

Thanks,
Shashi

How to make it single file upload component

Really nice component.
My backend code only handles single file upload.
How can make it for just uploading single file.?

Duplicates in upload file list

Hi,
first: great article/tutorial about uploading files in Angular - thx.

What I noticed is that selected files are put into new Set() object and if you click on "Add files" multiple times, and add the same file, you get multiple records of the same file in the Set file object.

Isn't the purpose to use Set() object to avoid duplicates?

Thx, Bye.

where the file is stored

how to save to db?

file image