ОШИБКА TypeError: Невозможно прочитать свойство 'testMethod' из неопределенного

Question

У меня есть следующий код для 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 проблемами в этом коде.

1. Мой первый файл console.log в testMethod () возвращает требуемое значение, что означает, что метод работает нормально, а значения сохраняются в dataArray , но когда я пытаюсь чтение dataArray внутри onRefre sh Linecap.data.datasets[0].data.push({x: Date.now(), y: this.dataArray[2] }); функция вызывает ошибку ОШИБКА TypeError: Невозможно прочитать свойство 'dataArray' из неопределенного
2. Если я вызываю testMethod в функции onRefre sh, такой как var ws=this.testMethod(), это выдает ошибку ОШИБКА TypeError: Невозможно прочитать свойство 'testMethod' из неопределенного . Последующий вызов console.log(this.testMethod()) также вызывает ту же ошибку

Что я не так делаю? Я не могу его найти. Как мне решить неопределенную ошибку для этого кода. Если я вызываю testMethod вне функции onRefre sh, он работает отлично, но возвращает пустой dataArray.

Answer 1

Значение ключевого слова this в функции Javascript зависит от использования. См. здесь для получения более подробной информации.

В любом случае это не будет относиться к области действия класса. Чтобы обратиться к области действия класса с помощью ключевого слова this, используйте выражение функции стрелки . Попробуйте следующее

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 });
    }
  }
}

Answer 2

Область видимости внутри функции onRefresh отличается от области видимости компонента, поэтому this не определено, вместо нее используется функция стрелки для onRefresh, как это

onRefresh: (Linecap)  => { ... }