angular - 如何在不将数据上传到服务器的情况下使用 Devextreme Angular 文件上传器

Question

我想使用 Devextreme angular 的文件上传器组件来解析 javascript 中的一些数据，但我似乎找不到方法，不先将数据发布到服务器。

我可以使用 xlsx 库和 htmlinput标记及其change事件解析 javascript 中的数据：

<input type='file' (change)="onSelectFile($event)" multiple>

和.ts：

onSelectFile(event) {
    if (event.target.files && event.target.files[0]) {
      const filesAmount = event.target.files.length;
      for (let i = 0; i < filesAmount; i++) {
        const reader = new FileReader();

        reader.onload = (event:any) => {

          const bstr: string = event.target.result;
          const data = <any[]>this.excelService.importFromFile(bstr);
          // data is ready
        };
        reader.readAsBinaryString(event.target.files[i]);
      }
    }
  }

我可以阻止文件上传器将数据上传到服务器，以便我可以先在客户端解析它吗？我想使用这个组件，因为它提供了开箱即用的验证和正确的样式。

谢谢

Answer 1

你可以试试。

<dx-file-uploader
  selectButtonText="Upload File"
  labelText="or Drop here"
  accept="*"
  uploadMode="useForm"
  [allowCanceling]="true"
  (change)="handleInputChange($event)"
></dx-file-uploader>

Answer 2

我建议使用uploadMode选项的'useForm' 值，但不要提交表单。