Home Angular A Simple Angular Material File Upload Component Library

A Simple Angular Material File Upload Component Library

Angular webcodeflow · May 12, 2022 · Comments off

Angular Material File Upload Tool is a simple and configurable file upload tool for use with Angular Material.

file upload angular, angular file upload example, angular material file upload, angular upload image

Multiple File Upload Using Bootstrap 4 and jQuery | SWALLOW

How to make use of it:

1. Install and download.

# NPM
$ npm install mat-file-upload --save

@NgModule({
  declarations: [AppComponent],
  imports: [
    ...
    MatFileUploadModule,
    ...
  ],
  providers: [],
  bootstrap: [AppComponent],
})
export class AppModule {}

2. Add the component to your template.

<mat-file-upload
  OPTIONS HERE
  >
</mat-file-upload>

3. Options are available with default values.

<mat-file-upload
  [labelText]="'Select file(s)'"
  [selectButtonText]="'Select file(s)'"
  [uploadButtonText]="'Upload File(s)'"
  [allowMultipleFiles]="false"
  [showUploadButton]="true"
  [customSvgIcon]="null"
  [acceptedTypes]="'*.*'"
  (uploadClicked)="onUploadClicked($event)"
  (selectedFilesChanged)="onSelectedFilesChanged($event)"
  >
</mat-file-upload>

Minimal File Select & Upload Component, Angular Material File Upload Plugin/Github