Angular call service after or in timeout

Question

I have this function that gets the innerHTML from an element. It works but only in a setTimeout function:

firstFunction() {

    let _this = this;
    setTimeout(function() {
      if(_this.myPanel != undefined){
        this.pathText = _this.myPanel.nativeElement.innerHTML;
        console.log(this.pathText);
      }

    }, 500); //THIS IS OK, console shows correct results after 0.5s

    this.changePathText(this.pathText); //CALL FUNCTION THAT CALLS SERVIS
}

This get's the innerHTML well and shows good data in the console after 0.5s. Now I want to get that data in a service, so after the timeout I call the changePathText function that has the service:

  changePathText(pathText) {
    console.log("changePathText in map activated", pathText);
    this.sightService.changePathText(pathText);
  }

The problem is here is that this servis is only called at the beginning of the first function, not after the timeout. So the service is never called with the new data.

I tried calling the service directly in the firstFunction after the console.log(this.pathText), but I get an error ERROR TypeError: Cannot read property 'changePathText' of undefined

How can I achieve this ?

This is what the service looks like:

  changePathText(pathText){
    console.log("servis changePathText activated", pathText);
    this.pathTextSource.next(pathText);
  }

And yes, I imported the service in the first file. It only doesn't work when I call the service in the timeout.

Answer 1

Figured it out ! The problem was with this. Because it was a nested this, I had to use _this in the timeout.

let _this = this;
setTimeout(function() {
  console.log(_this.myPanel);
  if(_this.myPanel != undefined){
    let ivan = _this.myPanel;
    console.log("Seg ivan myPath", ivan);
    //console.log("Seg myPath", JSON.stringify(this.myPanel.nativeElement.innerHTML));
    console.log(_this.myPanel.nativeElement.innerHTML);
    this.pathText = _this.myPanel.nativeElement.innerHTML;
    _this.sightService.changePathText(this.pathText);
  }

}, 500);