angular - 类型 'arrayBuffer' 上不存在属性 'File'

Question

在 Angular 应用程序中实现文件上传代码时出现类型错误。我正在使用 angular 8 和 typescript 3.5.3。以下是我的代码

模板 <input type="file" id="file" (change)="handleFileInput($event.target.files)">

组件类中的函数

  handleFileInput(files: FileList): void {
    files[0].arrayBuffer().then((value) => {
      console.log(value);
    });
   }

编译时出现这个错误: error TS2339: Property 'arrayBuffer' does not exist on type 'File'.

知道如何摆脱这个错误吗？

Answer 1

出现这个错误，是因为arrayBuffer()、stream()和text()实际上是在类型定义中缺失的文件/Blob。但这并不是一个忽视，根据 MDN 的说法，这些方法仍然只是工作草案的一部分，并没有得到很好的支持。如果您想修补打字，仍然能够使用 arrayBuffer() 之类的功能而不会出现 typescript 提示，那么您可以使用缺少的属性扩展 File 接口(interface)，即:

File {
    arrayBuffer: () => Promise<ArrayBuffer>
}

引用:https://github.com/microsoft/TypeScript/issues/34652