如何以角度读取CSV文件并在View上显示值？

Question

我尝试按照https://stackexchange.com/users/1001609/matt提供的解决方案来读取CSV文件：- How to read a csv file on angular2 line by line

我能够从csv文件读取数据并在类变量中设置值。我面临的问题可能与范围有关。我有一个类变量parsedCsv。我正在读取文件并使用this.parsedCsv = csv设置变量'parsedCSV'中的值； 当我从onload函数检查'parsedCSV'变量的值时，它按预期来了，但是当我试图在另一个单击事件后访问该值时，值来了未定义。 我要附加相同的代码。请通过代码或stackblitz链接以更好地了解我的问题，

stackblitz：-https://stackblitz.com/edit/angular-e1kown?file=src/app/app.component.ts

尝试上传csv文件。它将提醒您上传的数据。 然后，单击检查以再次查看上传的数据。

HTML：-

<div class="form-group">
        <input type="file" (change)="onFileSelect($event.target)" name="myfile">
        <button (click) = "displayValue()">check</button>
   </div>

在onload上调用的函数：-

onFileLoad(fileLoadedEvent): void {
      const csvSeparator = ';';
      const textFromFileLoaded = fileLoadedEvent.target.result;
      this.csvContent = textFromFileLoaded;

      const txt = textFromFileLoaded;
      const csv = [];
      const lines = txt.split('\n');
      lines.forEach(element => {
        const cols: string[] = element.split(csvSeparator);
        csv.push(cols);
      });
      this.parsedCsv = csv;

      // demo output as alert
      var output: string="";
      csv.forEach(row => {
        output += "\n";
        var colNo = 0;
        row.forEach(col => {
          if (colNo>0) output += " | ";
          output += col;
          colNo++;
        });
      });
      alert(this.parsedCsv); // Here i'm getting the expected value
    }

/*This method will be called on clicking the button. 
   Here parsedCsv is undefined. But i'm unaware of the reason. */

displayValue(){
    alert(this.parsedCsv); // undefined
  }

我希望displayValue（）函数能够提醒从csv文件获取的值。