從jQuery或其他事件訪問組件屬性

Question

我正在嘗試在Angular2組件中使用vis.js （或jQuery）click事件。 我的圖形顯示得很好，並且可以成功捕獲點擊事件。

但是，在單擊事件的上下文中，我松開了對組件屬性的引用。 例如，在事件內undefined this.visData ：

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