在文件上传对话框中更改事件

Question

我正在使用angular并尝试通过“图像上载”按钮将图像上载到数据库中以打开文件对话框。为此，我希望能够使用此按钮添加多个图像，然后最终上传它们。

我的按钮如下所示：

  <div class="file-managment">
    <button class="mat-raised-button custButt" style="margin: 5px;">Upload Images
      <label class="hiddenDialog">
        <input #file (change)="handleFile($event)" accept="image/*" type="file" multiple="multiple">
      </label>
    </button>
    <button class="mat-raised-button custButt" style="margin: 5px;">Delete Images</button>   </div>

在handleFile($event)函数中，我只是将对话框中的文件添加到列表中。

handleFile(event) {
  this.fileToUpload = event.target.files;
  this.uploadImages.append(this.fileToUpload.name, this.fileToUpload);
  console.log('added an element');
}

但是，当我多次使用上载按钮上载多个文件时，我注意到handleFile($event)函数仅被调用一次。我在这种情况下使用（change）事件错误吗？我该如何进行这项工作？