从jQuery或其他事件访问组件属性

Question

我试图在Angular2组件中使用vis.js（或jQuery）单击事件。我的图表显示得很好，我可以成功捕捉点击事件。

但是，在点击事件的上下文中，我放弃了对组件属性的引用。例如，this.visData是从事件中undefined：

export class GraphContainerComponent implements OnInit { 
    private visData: {}; 
    private options: {} = {}; 
    private network: any; 
    @ViewChild('graphContainer') graphContainer; 

    ngOnInit() { 
     // populates this.visData 
     // this.visData = { nodes, edges } 
     this.makeGraph(); 
    } 

    makeGraph() { 
     // no problem creating and displaying my graph, everything works 
     this.network = new vis.Network(this.graphContainer.nativeElement, this.visData, this.options); 

     // click event 
     this.network.on("selectNode", function (params) { 
      console.log(this.visData); // logs "undefined" 
     } 

     $('a').on('click', function() { 
      console.log(this.visData); // "undefined" as well 
     }); 
    } 
} 

我明白为什么这是正常的行为，我知道混合Angular2和jQuery或其他一些DOM的操纵库是不推荐的做法，但有时它的你得到的全部。

从这些事件中维护对组件属性的引用的最佳方法是什么？

至关重要的是，我的页面上有几十个这样的组件，所以我不认为某种全局存储是要走的路。

Answer 1

尝试使用箭头函数（（）=>）如下所示，

this.network.on("selectNode", (params)=> { //<----this should work. 
     console.log(this.visData); // logs "undefined" 
    } 

$('a').on('click',()=> {     //<----this should work. 
      console.log(this.visData); // "undefined" as well 
});