Javascript 将文件读取器API中的值添加到数组

我有下面的代码，它上传了一个图像并获得了图像的尺寸。我现在尝试将这些维度添加到数组中。这是我的密码

files_dropped: File[] = [];

  onSelect(event) {
    this.files_dropped.push(...event.addedFiles);
    const formData = new FormData();

    for (var i = 0; i < this.files_dropped.length; i++) {
      formData.append("file[]", this.files_dropped[i]);
      const reader = new FileReader();
      reader.addEventListener("load", function () {
        const img = document.createElement("img") as HTMLImageElement;
        img.onload = () => {
          console.log(img.naturalWidth, img.naturalHeight);
        }
        img.src = reader.result as string;
      }, false);
      
      reader.readAsDataURL(this.files_dropped[i]);
    }
  }

已删除的文件：文件[]=[]； onSelect（事件）{ 此.files_drop.push（…event.addedFiles）； const formData=new formData（）； 对于（var i=0；i{ console.log（img.naturalWidth，img.naturalHeight）； } img.src=reader.result作为字符串； }，假）； reader.readAsDataURL（this.files_drop[i]）； } } 如果I console.log退出，则您删除的这个.files\u看起来像这样

---

因此，我试图获取

img.naturalWidth，img.naturalHeight

的值，并将它们推送到[File]属性，如我们如何查看

name

，

size

等，但我被困在这里了

你能分享

console.log（这个.files\u）的结果吗

在onSelect方法的第一行内是？@Enijar我在问题中添加了它hmm，这是一个奇怪的错误。为了测试，您可以添加

const ctx=this

第一次选择

方法，并将
此方法替换为
。
引用为
ctx.
？@Enijar是的，我可以这样做，但我如何将其添加到数组中？我尝试了这个
ctx.files\u drop[I].push（img.naturalWidth）
但是我得到
属性'push'在类型'File'上不存在。
下面是一个stackblitz示例，你能分享一下
console.log（这个.files\u drop）的输出吗
在onSelect方法的第一行内是？@Enijar我在问题中添加了它hmm，这是一个奇怪的错误。为了测试，您可以添加
const ctx=this
第一次选择
方法，并将
此方法替换为
。
引用为
ctx.
？@Enijar是的，我可以这样做，但我如何将其添加到数组中？我尝试了这个
ctx.files\u drop[I].push（img.naturalWidth）
但是我得到
属性“push”在类型“File”上不存在。
下面是一个stackblitz示例