Angular2：使用 Promise 检索 FileReader 结果答案

【问题标题】：Angular2: Retrieve FileReader result with a PromiseAngular2：使用 Promise 检索 FileReader 结果
【发布时间】：2017-09-08 03:38:42
【问题描述】：

在我看来，有一个输入文件与控制器的一个功能相关联

<input type="file" style="display: none;" (change)="importXML($event)">

此函数调用服务中的函数，假设将我的 xml 文件转换为 json

importXML(event): void {
        const obj = this.myService.convertXML2Json(event.target);
}

在服务函数中，在FileReader中读取XML文件，然后进行转换到文件阅读器的onloadend部分中的xml

convertXML2Json(event): any {
    const file = event.files[0];
    const fr = new FileReader();
    fr.onloadend = e => xmltoJsonFunction(fr.result);
    fr.readAsText(file)
}

如何在 onloadend 中检索转换后的 json 结果以在 Angular 控制器中使用它，特别是使用 Promise ？或者我应该使用 setTimeout 吗？

【问题讨论】：

标签： angular typescript promise settimeout filereader

【解决方案1】：

您的结果不在fr 对象内。你的回调函数里面的参数e有读取文件的结果：

fr.onloadevent = e => xmltoJsonFunction(e);

【讨论】：

【解决方案2】：

实际上，如果我只在控制器部分编码，我找到了解决方法：

  public XMLParsed;

  importXML(event): void {
    const file = event.target.files[0];
    const fr = new FileReader();
    fr.onloadend = (e: any) => {
        this.XMLParsed = xmlToJSON(e.target.result);
    };
    fr.readAsText(file);

【讨论】：