Angular 无法将文件输入标记链接到角度组件功能

我正在尝试做一些非常基本的事情。其思想是读取一个日志文件，并在处理和过滤后以表格格式显示该文件

我已经完成了英雄教程。我的项目只有一个组件

app.component.html

<div style="text-align:center">
  <h1>
    Welcome to {{ title }}!
  </h1>
</div>

<app-maindisplay></app-maindisplay>

<div style="text-align:left">
  <input type="file" id="LogFileInput" onchange="handleFile(this.files)">
</div>

maindisplay.component.html

<div style="text-align:center">
  <h1>
    Welcome to {{ title }}!
  </h1>
</div>

<app-maindisplay></app-maindisplay>

<div style="text-align:left">
  <input type="file" id="LogFileInput" onchange="handleFile(this.files)">
</div>

“文件”对话框正确显示

但是，当在chrome控制台上选择该文件时，会出现以下错误消息

未捕获引用错误：未定义handleFile 在HTMLInputElement.onchange localhost/：13

你能帮我解决这个问题吗？ 一旦调用该函数，我就能够处理文件操作

致以最良好的祝愿， Vinayak

您应该使用change并将$event传递给方法

<input type="file" id="LogFileInput" (change)="handleFile($event)">

Typescript方法应该如下所示

handleFile(event): void {
   this.files = event.target.files;
   console.log('The Handle file got called');
   console.log(this.files); // logs selected files
}

---

很高兴帮助你