Question

我正在尝试使用Angular 4在我的应用程序中上传文件。我能够上传单个文件以及多个文件。但是当用户试图浏览并上传第二个文件时，我必须阻止。

简而言之，只能上传一个文件，如果他们尝试上传另一个文件，则应该弹出一个窗口。

请帮助实现相同目标。

Answer 1

使用 change 事件将输入文件元素传递给函数。

<input ng-model="photo" (change)="onChange($event)" type="file" accept="image/*" />

功能

 onChange($event: any) {

    if($event.target.files.length > 1){
      alert("select only one file at a time...");
      return;
   }else{
     // Do your other stuff...
   }
}

Answer 2

您可以检查输入的 change 事件并触发功能并检查

<input (change)="myUploader($event)" multiple type="file" accept="image/*" />

 myUploader($event: any) {
    if ($event.target.files.length > 2) {
      console.log('limit reached')
      return false;
    } else if ($event && $event.target.files.length) {
      // Your code
    }
  }

阻止多文件选择并以角度4上传

2 个答案: