错误TypeError:无法读取未定义的属性'testMethod' [英] ERROR TypeError: Cannot read property 'testMethod' of undefined

问题描述

我有以下代码用于 component.ts

export class HomeComponent implements OnInit {
  Linecap = {};
  dataArray=[];

  constructor(private chartGetDataService: ChartGetDataService) {
 }

  ngOnInit(): void {
         this.chartPlotting();
  }


public testMethod(){
  this.chartGetDataService.getLatestData1().subscribe( list=>{ this.dataArray=list.map(item=>{return item.payload.val()});} );
  console.log(this.dataArray);
  return this.dataArray;
 }

public chartPlotting(){

  this.Linecap= new Chart('canvas',
  {
   type: 'line',
   data: { labels: [moment().toDate().getTime()], datasets: [{ label:'Flow',yAxisID: 'A',lineTension: 0, data: [] , borderColor: '#3cb371', fill: false ,borderWidth:2},
                                                            ]
         },
   options: { responsive: true,animation: {duration: 0},hover: {animationDuration: 0},responsiveAnimationDuration: 0,
              scales: { xAxes: [{ type: 'realtime',time: { parser: undefined} , display: true }],
                        yAxes: [{ id:'A', display: true, ticks: { beginAtZero: true, fontColor:'#f4af07',  stepSize: 10, max: 100}},
                                ]
                      },

              plugins: {  streaming: {
                      duration: 60000,
                      refresh: 2000,
                      delay: 3000,
                      pause: false,
                      ttl: undefined,
                      frameRate: 2,
                      onRefresh: function(Linecap) {

                        console.log(this.testMethod())
                        console.log(this.dataArray)

                                                                        Linecap.data.datasets[0].data.push({x: Date.now(), y: this.dataArray[2] });
                        Linecap.update({ preservation: true });
                        }

                    }
},

}

})

}

我在此代码中遇到2个问题.

I am stuck with 2 problems in this code.

1. 我在 testMethod()中的第一个console.log返回所需的值，这意味着方法可以正常工作，并且值存储在 dataArray 中，但是当我尝试读取时 onRefresh 内部的dataArray Linecap.data.datasets [0] .data.push({x:Date.now()，y:this.dataArray [2]});函数会给我错误 ERROR TypeError:无法读取未定义的属性'dataArray'
2. 如果我在onRefresh函数(如 var ws = this.testMethod())中调用testMethod，则会出现错误 ERROR TypeError:无法读取未定义的属性'testMethod'.随后调用 console.log(this.testMethod())也会引发相同的错误

1. My first console.log in testMethod() returns desired value that means method is working fine and values are stored in dataArray but when I try to read dataArray inside onRefresh Linecap.data.datasets[0].data.push({x: Date.now(), y: this.dataArray[2] }); function it gives me error ERROR TypeError: Cannot read property 'dataArray' of undefined
2. If I call testMethod in onRefresh function like var ws=this.testMethod() it gives me error ERROR TypeError: Cannot read property 'testMethod' of undefined. Subsequent call of console.log(this.testMethod()) is also throwing same error

我在做什么错?我找不到它.如何解决此代码的未定义错误.如果我在onRefresh函数外部调用testMethod，则它可以正常工作，但返回的数据数组为空.

What wrong I am doing? I am not able to find it. How do I solve undefined error for this code. If I call testMethod outside onRefresh function it works perfectly but it returns empty dataArray.

推荐答案

JavaScript函数中 this 关键字的含义取决于用法.有关更多详细信息，请参见此处.

Meaning of this keyword in a Javascript function depends on the usage. See here for more details.

无论哪种方式，它都不会引用该类的范围.要使用 this 关键字引用类的范围，请使用

Either way it will not refer to the scope of the class. To refer to the scope of the class using the this keyword, use arrow function expression. Try the following

plugins: {  
    .
    .
    .
    onRefresh: (Linecap) => {
      console.log(this.testMethod())
      console.log(this.dataArray)
      Linecap.data.datasets[0].data.push({x: Date.now(), y: this.dataArray[2] });
      Linecap.update({ preservation: true });
    }
  }
}

这篇关于错误TypeError:无法读取未定义的属性'testMethod'的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！