Question

我有一个输入类型文件HTML元素，想要上传和读取JSON文件，并将文件的对象内容存储在本地变量中。假设这是我在阅读该文件后得到的JSON对象： -

{
   name:{
        firstName: "Name1",
        lastName: "Name2"
   }
}

现在，我希望在读取文件

后将此对象存储在变量中

private jsondata = {};

readfile(eve){
    let reader:any,
    target:EventTarget;
    reader= new FileReader();

    reader.onload = function(eve:any) {
        this.jsondata['json_def'] = JSON.parse(eve.target.result);

        console.log(this.json_def);
    }
    reader.readAsText(eve.target.files[0]);
}

这是我上传时在控制台中收到的错误：

ERROR TypeError: Cannot set property 'json_def' of undefined
at FileReader.reader.onload (create-model.component.ts:135)
at ZoneDelegate.invoke (zone.js:391)
at Object.onInvoke (core.es5.js:3890)
at ZoneDelegate.invoke (zone.js:390)
at Zone.runGuarded (zone.js:154)
at FileReader.<anonymous> (zone.js:132)

我没有得到这个错误的确切原因。请有人帮忙。感谢。

Answer 1

this中的

reader.onload不是对象的上下文。因此它没有任何名为jsondata的变量。您可以使用arrow function保留对象的上下文。

reader.onload = (eve:any) => {
    this.jsondata['json_def'] = JSON.parse(eve.target.result);

    console.log(this.json_def);
}

错误TypeError：无法设置未定义的Angular2的属性'abc'

1 个答案: