Angular 角度8：无法访问FileReader onloadend方法内设置的类变量

我无法访问FileReader onloadend方法中设置的类变量

这是我的密码：

analyzeData(){
let file = this.fileRestful[0];
let fileReader: FileReader = new FileReader();
fileReader.onloadend = () => {
  this.fileContent= fileReader.result as string;
}
fileReader.readAsText(file);
console.log(this.fileContent)

}

到目前为止，我已经试过3种方法，但都不管用。以下是：

fileReader.onloadend=（）=>{
this.fileContent=fileReader.result作为字符串；
}

fileReader.onloadend=函数（e）={
this.fileContent=fileReader.result作为字符串；
}.绑定（此）

让self=this；
fileReader.onloadend=函数（e）={
self.fileContent=fileReader.result作为字符串；
}

我已经看到了大部分解决方案，但没有一个对我有效。

---

请让我知道我在哪里出错。谢谢。

我不认为这里的问题是由

这个

关键字引起的。您的

this

正好指向正确的位置，但是没有为

this.fileContent

变量指定任何内容

此.fileContent

是在中设置的。分配将在

console.log

之后执行，因为

fileReader.onloadend

只是一个侦听器，类似于DOM中的

onclick

侦听器

fileReader.onloadend=（）=>{
this.fileContent=fileReader.result as string；//此代码将在将来某个时间执行
}
readAsText（文件）；
console.log（this.fileContent）；//此代码将首先执行

换句话说，在第一行中，您向事件添加了一个事件侦听器。您的箭头功能将在

loadend

发生时执行，而不是立即执行。什么时候会发生-我们不知道，可能在三年内，可能在0.0002秒内，但肯定是在您的其余代码执行之后

解决方案 当您将

控制台.log移动到代码的异步部分时，它将反映实际情况，如下所示：

fileReader.onloadend=（）=>{
this.fileContent=fileReader.result as string；//此代码将在将来某个时间执行
console.log（this.fileContent）；//然后执行console.log
}
readAsText（文件）；

setTimeout
，*

处理程序上的

和
addEventListener
中的代码都是我们需要始终记住代码执行时间的示例。它可以在同步代码后3秒或3年执行。
我推荐阅读的规范资源。这是很多，但为了编写js代码，必须理解它。
我不认为这里的问题是由
这个
关键字引起的。您的
this
正好指向正确的位置，但是没有为
this.fileContent
变量指定任何内容

此.fileContent
是在中设置的。分配将在
console.log
之后执行，因为
fileReader.onloadend
只是一个侦听器，类似于DOM中的
onclick
侦听器

fileReader.onloadend=（）=>{
this.fileContent=fileReader.result as string；//此代码将在将来某个时间执行
}
readAsText（文件）；
console.log（this.fileContent）；//此代码将首先执行

换句话说，在第一行中，您向事件添加了一个事件侦听器。您的箭头功能将在
loadend
发生时执行，而不是立即执行。什么时候会发生-我们不知道，可能在三年内，可能在0.0002秒内，但肯定是在您的其余代码执行之后

解决方案
当您将
控制台.log移动到代码的异步部分时，它将反映实际情况，如下所示：

fileReader.onloadend=（）=>{
this.fileContent=fileReader.result as string；//此代码将在将来某个时间执行
console.log（this.fileContent）；//然后执行console.log
}
readAsText（文件）；

setTimeout
，*
处理程序上的
和
addEventListener
中的代码都是我们需要始终记住代码执行时间的示例。它可以在同步代码后3秒或3年执行。
我推荐阅读的规范资源。这有很多，但是为了编写js代码，必须理解它。
Hi@ganqqwery：正如您提到的console.log（this.fileContent）；总是打印出来。我的问题是，即使等待，我也无法访问onloadend函数之外的文件内容。无法访问
onloadend函数之外的
fileContent
，因为javascript引擎不会等到
onloadend
完成。
onloadend
函数声明之后的代码将在
onloadend
函数之后执行。在这里您可以访问它。我可能错了。但这对我不起作用。那里的情况不同。在angular core中有一个异步无限循环，它总是检查模板中变量的值是否已更改，称为更改检测。这就是它向您显示内容的原因。假设您的console.log位于永无止境
setInterval
中，它会连续打印值。Ok。那么我现在有什么选择呢？我想获取fileContent并调用另一个RESTAPI，其对象位于类构造函数中。但是当我在onload函数中使用带有“this”的REST服务时，它总是为null；总是打印出来。我的问题是，即使等待，我也无法访问onloadend函数之外的文件内容。无法访问
onloadend函数之外的
fileContent
，因为javascript引擎不会等到
onloadend
完成。
onloadend
函数声明后的代码将在
onloadend