angular的最小文件选择和上传组件– mat-file-upload

angular的最小文件选择和上传组件– mat-file-upload
插件名称 mat-file-upload
发布时间 2020年4月15日
插件作者 bjsawyer

使用Angular,Angular材质和材质图标构建的非常干净且完全可配置的文件选择器和上传器组件。

如何使用它:

1.安装并下载。

# NPM
$ npm install mat-file-upload --save
@NgModule({
  declarations: [AppComponent],
  imports: [
    ...
    MatFileUploadModule,
    ...
  ],
  providers: [],
  bootstrap: [AppComponent],
})
export class AppModule {}

2.将组件添加到模板。

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

3.带有默认值的可用选项。

  • labelText:标签文字
  • selectButtonText:选择按钮的文本
  • uploadButtonText:上传按钮的文本
  • allowMultipleFiles:允许多文件上传
  • showUploadButton:是否显示上传按钮
  • customSvgIcon:定制SVG图标
  • acceptedTypes:允许的扩展名
  • uploadClicked:点击
  • selectedFilesChanged: onchanged
<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>