How to Handle Folder Uploads in an Angular App

At Lucidpress, we recently decided to revamp our image manager experience by creating a completely new image manager written in Angular 2 and Typescript. One of the key new features we wanted to add was bulk image upload, which is the ability to upload a folder with all of its contents while maintaining the original folder structure. There are two ways for a user to initiate folder uploads:

Drag and drop a folder
Provide a file picker that allows folder selection

It took a little research to find the modern method for handling folder uploads. I compiled a few code snippets with explanations as a quick reference for others. Here’s a look at how you can implement this feature in your web app.