Angular 角度：在Typescript中声明对象数组

我试图在Typescript中声明一个对象数组。但是，检索对象时遇到错误。下面是我的代码。图显示了此文件的输出。附件

当我尝试使用检索它们时，这会导致未定义

this.info[0]

如果我跳过第二行，即.info=[]，我会得到一个错误

无法读取未定义的属性“0”

我申报错了吗？如何按索引检索信息

---

问题是异步调用

当您的循环完成并执行这两行时。。。那时reader.onload还没有完成，因此这个.info.pushtemp；未运行，当您运行以下两行时，控制台中出现空白：

console.log(this.info);
console.log(this.info[0]); //this is what i need

我们需要做的是让循环完成，在最后一次迭代中，循环的i==infos.length-1。。。我们在控制台上打印值并得到正确的结果

相关TS：

---

complete

Akber Iqbal的答案是可行的，但他们的解决方案不能保证文件与附件数组的顺序相同，因此

如果信息项的顺序与附件数组中的文件的顺序相同，那么这里有一个解决方案。您正在寻找第一件物品，因此它可能很重要。我们可以使用承诺和异步/等待：

异步onFileSelectedevent{ 此参数为：附件=[]； this.info=[]； 对于let index=0；index0{ 对于let i=0；i readFilefile，i{ 返回新的PromiseSolve，拒绝=>{ let reader=新文件读取器； reader.onload=e:any=>{ 设温度={ id:我， url:e.target.result， message:file.name，//为了进行测试，我将文件名作为message } 分解温度； }; reader.readAsDataURLfile } }

---

演示：

如果您共享更多代码，那就更好了，因为这里有一些基本的错误，首先，您在声明信息时没有使用此选项，但您在下一行尝试使用此选项访问信息，this.info将在您的上下文中创建新的信息对象，我相信这是一些事件处理程序，现在，如果您尝试在删除第二个时访问this.info，您将得到一个错误，因为没有关于此上下文的任何信息，请阅读&@Harshkurra我无法在typescript.show中声明此信息，以显示您正在呼叫的位置previewInfoinfos@LuisRico根据请求更新。最好在此处共享MVCE stackblitz

this.info[0]

console.log(this.info);
console.log(this.info[0]); //this is what i need

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent {

  //Variable declaration
  attachments = [];
  info = [];

  onFileSelected(event) {
    this.attachments = [];
    for (var index = 0; index < event.target.files.length; index++) {
      var file = event.target.files[index];
      this.attachments.push(file);
    }
    if (this.attachments.length > 0) {
      this.previewInfo(this.attachments);
      console.log('caller', this.attachments);
    }
  }

  previewInfo(infos) {
    this.info = [];
    if (infos) {
      for (let i = 0; i < infos.length; i++) {
        let reader = new FileReader();
        reader.onload = (e: any) => {
          let temp = {
            id: i,
            url: e.target.result,
            message: "",
          }
          //console.log(temp);
          if (i == infos.length - 1) {
            this.pusher(temp, true);
          } else {
            this.pusher(temp, false);
          }
          //this.info.push(temp, function(){ console.log('pushed'); } );
        }
        reader.readAsDataURL(infos[i]);
      }
      console.log('empty: ', this.info);
      console.log('empty: ', this.info[0]); //this is what i need
    }
  }

  pusher(tempFile, lastFile) {
    this.info.push(tempFile);
    if (lastFile == true) {
      console.log('Correct Filled: ', this.info.length);
      console.log('Correct Filled: ', this.info[0]); //this is what i need
    }
  }

}