Exchange Data Between Angular Component And Js Script

I hope my question as not asking before.

I'm working with Angular9 and a JS plugin (A-Frame).

I prepared a script is get data and I want to return this data in my component angular for managing his after.

AFRAME.registerComponent('cursor-listener', {
  init: function () {
      this.el.addEventListener('click', function (evt) {
          console.log('I was clicked at: ', evt.detail.intersection.object);
      });
  }
});

In the script you see above, the console log returns information that is useful to me. I would like to be able to return them in my angular component to process the information later.

I'm beginner with this framework, so excuse me for my ignorance.

Thank you for your futur response, I waiting to read you.

You could use arrow function notation to refer to the class member variables using this keyword. In a conventional JS function, this keyword refers to the scope of the function.

intersectionObj: any;

AFRAME.registerComponent('cursor-listener', {
  init: () => {         // <-- arrow function here
    this.el.addEventListener('click', (evt) => {       // <-- and here
      console.log('I was clicked at: ', evt.detail.intersection.object);
      this.intersectionObj = evt.detail.intersection.object;
    });
  }
});