Minimal File Select & Upload Component For Angular Material – mat-file-upload

Author: bjsawyer
Official Page: Go to website
Publish Date: November 7, 2019
License: MIT


A pretty clean and fully configurable file picker & uploader component built with Angular, Angular Material, and Material Icons.

How to use it:

1. Install & download.

$ npm install mat-file-upload --save
  declarations: [AppComponent],
  imports: [
  providers: [],
  bootstrap: [AppComponent],
export class AppModule {}

2. Add the component to your template.


3. Available options with default values.

  • labelText: label text
  • selectButtonText: text of select button
  • uploadButtonText: text of upload button
  • allowMultipleFiles: allows multi-file upload
  • showUploadButton: whether or not to show the upload button
  • customSvgIcon: custom SVG icon
  • acceptedTypes: allowed extensions
  • uploadClicked: on click
  • selectedFilesChanged: onchanged
  [labelText]="'Select file(s)'"
  [selectButtonText]="'Select file(s)'"
  [uploadButtonText]="'Upload File(s)'"

You Might Be Interested In:

Add Comment