FIX

Question

我是Typescript的新手，有语法问题。我想加载用户选择的文件（不使用JQuery），现在将结果打印到控制台。我遵循了JS中的一些指南，但没有成功。这就是我到目前为止所拥有的。

index.html

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

index.ts

<input type="file" id="file-input" >

这会在控制台报告中出现以下错误：

document.getElementById("file-input").addEventListener("change", e => {
  var reader = new FileReader();
  var self = this;
  reader.onload = file => {
      var contents: any = file.target;
      self.text = contents.result; 
  };
  console.log(self.text.toString());
}, false);

我不太确定如何从缓冲区中获取文本，或者我什至没有正确设置文本。

更新：当前代码经过修改：

Uncaught TypeError: Cannot read property 'toString' of undefined
    at HTMLInputElement.<anonymous>

Answer 1

关注代码

  reader.onload = file => {
      var contents: any = file.target;
      self.text = contents.result; 
  };
  console.log(self.text.toString());

您认为它具有以下执行顺序：

  reader.onload = file => {
      var contents: any = file.target;
      self.text = contents.result; // FIRST 
  };
  console.log(self.text.toString()); // SECOND

现实中的执行顺序：

  reader.onload = file => {
      var contents: any = file.target;
      self.text = contents.result; // SECOND
  };
  console.log(self.text.toString()); // FIRST

因此，由于.text在运行时尚未分配self.text.toString，因此您会收到错误消息。

FIX

一种方式：

  reader.onload = file => {
      var contents: any = file.target;
      self.text = contents.result; // FIRST
      console.log(self.text.toString()); // SECOND 
  };

如何在TypeScript中加载文件

1 个答案:

FIX