如何替换以前选择的文件？答案

【问题标题】：How to replace a previously selected file?如何替换以前选择的文件？
【发布时间】：2020-01-24 14:50:23
【问题描述】：

我正在通过 ngx-dropzone-wrapper 将 Dropzone 与 Angular 一起使用。

我没有直接从 Dropzone 使用上传，我只是让它收集文件，然后在我的代码中处理它们。

我需要将文件数限制为 1。所以我设置了config.maxFiles = 1。事实上，现在文件打开对话框只允许选择单个文件。但问题是 Dropzone 不会替换以前的文件！相反，它将新文件添加到其文件集合中，并带有接受=假（很可能，因为已达到 maxFiles）标志。这不是我所期望的。我需要config.maxFiles = 1 删除旧文件并添加新文件并接受它。

所以，我应该致电removeAllFiles(true) 来支持我的要求。但是我找不到任何在用户选择文件之后和 Dropzone 尝试处理它之前触发的事件处理程序。

那么，我该如何实现以下要求：

用户一次只能选择一个文件
如果用户出错并想选择另一个文件，新文件应替换之前选择的文件

【问题讨论】：

哪里可以放这个函数。 maxfilesexceeded：函数（文件）{ this.removeAllFiles(); this.addFile(文件); }，我是一个初学者，我不知道具体在哪里。谢谢
@simo9900 我是这样做的：<div [dropzone]="config" (maxFilesReached)="maxFilesReached($event)" class="dropzone-top-layer"></div> 然后在我的 Angular 组件中有一个函数：public maxFilesReached(event: any): void { this.dropzone.dropzone().removeAllFiles(true); }
感谢您的回复。但它不起作用。它仅删除文件但不添加最新文件。你能把整个代码发过来吗？
@simo9900 您必须手动替换文件。在 dropzone 配置中，添加此方法 accept: this.localAcceptHandler 。在该函数中，我手动将文件添加到我自己的集合`this.files = [file];`。我有变量public files: any = [];，后来我使用我的files 而不是this.dropzone.dropzone().files。老实说，Dropzone 还有一些其他令人不快的怪癖（在内存中加载文件 blob 时难以显示进度，与 MatDialog 的错误集成无缘无故显示两次），我不会在下一个项目中使用它。

标签： angular file-upload dropzone.js

【解决方案1】：

您需要告诉 dropzone 放弃第一张图片。您需要在您的 dropzone 选项中设置 maxfilesexceeded 的功能。

 maxfilesexceeded: function (files) {
        this.removeAllFiles();
        this.addFile(files);
 },

它在内部工作，如果您的 maxfiles 是一个，并且您要添加第二个，则第一个将被丢弃，因为它超出了限制

【讨论】：

谢谢，会试试的。一个疑问 - 此时所有文件（第一个文件除外）都将具有accepted = false，所以我想我必须过滤文件集合以仅获取第二个文件（因为第一个文件是我想要的旧文件现在忽略）。
是的，你是对的。您需要通过接受的参数过滤文件，这样第一个文件就不会被发送保存。我认为如果您在第一个文件被丢弃时控制文件，您将发送您在 d 区域中放置的最后一个文件。
哪里可以放这个函数。我是初学者，我不知道具体在哪里。谢谢
@simo9900 如果您使用的是 jquery，则可以在您的 dropzone 选项中添加这样的功能。 $dropzoneArea = new Dropzone('div#dropzoneDrop', { // url: '/file/post', addRemoveLinks: true, //thumbnailWidth: "100", //thumbnailHeight: "100", uploadMultiple: true, autoProcessQueue:假，parallelUploads：4，maxFilesize：4，maxFiles：4，maxfilesexceeded：函数（文件）{this.removeAllFiles（）；this.addFile（文件）；}}）；
谢谢。不幸的是，我没有使用 Jquery