首页 > 解决方案 > Angular / Typescript无法设置未定义的属性“数据”

问题描述

我有一些代码正在读取 xml 然后解析数据。

所以这里是代码:

data = [];

  ngOnInit() {
  this.myService.getData().subscribe(XMLResult => {
    const parseString = require('xml2js').parseString;
    parseString(XMLResult, function (err, result) {
       console.dir(result.listResponse.instance); // Returns Array
       this.data = result.listResponse.instance; // Here's the line giving me the error
    });

 });
}

Console.log 正在返回如下数据:

Array(10)
  0:
   $: {id: "23" name: "name 1"}
  1:
   $: {id: "45" name: "name 2"}

ETC

我该如何解决这个问题?

标签: javascriptangulartypescript

解决方案


在您当前的方法中,this不再引用您的组件。

修改您的回调以使用箭头函数,这样您就不会丢失范围:

parseString(XMLResult, (err, result) => {
  console.dir(result.listResponse.instance);
  this.data = result.listResponse.instance;
})

文档

在箭头函数之前,每个新函数都定义了自己的 this 值(在构造函数的情况下是一个新对象,在严格模式函数调用中是未定义的,如果函数被称为“对象方法”,则为基础对象等)。事实证明,对于面向对象的编程风格,这并不理想。


推荐阅读