Angular组件与js脚本之间交换数据

Question

我希望我的问题以前没有问过。

我正在使用 Angular9 和一个 JS 插件（A-Frame）。

我准备了一个脚本来获取数据，我想在我的组件 angular 中返回这些数据，以便管理他的后续工作。

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

在您在上面看到的脚本中，控制台日志返回对我有用的信息。 我希望能够在我的 angular 组件中返回它们，以便稍后处理信息。

我是这个框架的初学者，所以请原谅我的无知。

感谢您对未来的回应，我等着读您。

Answer 1

您可以使用箭头 function 表示法来引用使用this关键字的 class 成员变量。 在常规的JS function中， this关键字是指function的scope。

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