如何避免输入类型文件添加多个文件?

时间:2018-08-09 12:52:19

标签: angular typescript

每当我选择一个文件要输入一个新文件时,我只希望输入一个文件,但是我当前的代码要使用多个文件。

 <input id="input-file" type="file" name="file" (change)="onFileSelected($event)" accept="application/pdf;image/jpeg;image/gif;image/tif;image/tiff;image/jpg;image/png;application/vnd.openxmlformats-officedocument.presentationml.presentation" />

打字稿代码:

 onFileSelected(event){
    let file = event.target.value;

}

1 个答案:

答案 0 :(得分:1)

如果您要上传一个文件

HTML

<input type='file' accept="application/pdf;image/jpeg;image/gif;image/tif;image/tiff;image/jpg;image/png;application/vnd.openxmlformats-officedocument.presentationml.presentation" (change)="onSelectFile($event)" >

ts

 onSelectFile(event) {
        if (event.target.files && event.target.files[0]) {                         
                    var reader = new FileReader();        
                    reader.onload = (event) => {
                      console.log(event.target.result);
                       this.urls=event.target.result; 
                    }

                    reader.readAsDataURL(event.target.files[0]);
            }
        }

示例:https://stackblitz.com/edit/angular-multi-file-upload-preview-qt5zrt