Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/angular/28.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Jquery 从VisJS事件调用Angular2组件函数_Jquery_Angular_Vis.js - Fatal编程技术网

Jquery 从VisJS事件调用Angular2组件函数

Jquery 从VisJS事件调用Angular2组件函数,jquery,angular,vis.js,Jquery,Angular,Vis.js,我正在一台计算机上做一些适应性测试。我已经将它与Angular2集成,但是我想在单击网络元素时调用Angular2组件函数。下面是生成基本网络图的组件: import {Component, OnInit, ViewChild, ElementRef} from '@angular/core' //reference to visjs library declare var vis: any; @Component({ selector: 'visjs', templateU

我正在一台计算机上做一些适应性测试。我已经将它与Angular2集成,但是我想在单击网络元素时调用Angular2组件函数。下面是生成基本网络图的组件:

import {Component, OnInit, ViewChild, ElementRef} from '@angular/core'

//reference to visjs library
declare var vis: any;

@Component({
    selector: 'visjs',
    templateUrl: './app/visJs/visjs.basic.html'
})

export class VisJsBasicComponent implements OnInit {

    @ViewChild('network') _element: ElementRef; 

    ngOnInit() {

        this.createBasicNetwork();
    }

    createBasicNetwork(): void{
        // create an array with nodes
        var nodes = new vis.DataSet([
            { id: 1, label: 'Node 1' },
            { id: 2, label: 'Node 2' },
            { id: 3, label: 'Node 3' },
            { id: 4, label: 'Node 4' },
            { id: 5, label: 'Node 5' }
        ]);

        // create an array with edges
        var edges = new vis.DataSet([
            { from: 3, to: 1 },
            { from: 1, to: 2 },
            { from: 2, to: 4 },
            { from: 2, to: 5 }
        ]);

        //create the network
        var data = {
            nodes: nodes,
            edges: edges
        };
        var options = {};
        var network = new vis.Network(this._element.nativeElement, data, options);

        network.on("click", function (params) {
            window.alert('onclick');
        });
    }
}
而不是

network.on("click", function (params) {
            window.alert('onclick');
        });
我想做点像

network.on("click", function (params) {
        this.myComponentFunction(params);
});
但这是angular2与jquery方法的混合。。。我该怎么做呢?

我把它改成:

var network = new vis.Network(this._element.nativeElement, data, options);

network.on('click', (params) => {
   if (params && params.nodes && params.nodes.length === 1) {
      this.nodeClicked(params);
    } else {
       console.log('non node element clicked');
    }
});    
}

nodeClicked(params: any): void {
   this._router.navigate(['/Node',params.nodes[0]]);
}
我认为问题在于,当方法看起来像这样时:

function (params) {
            window.alert('onclick');
        }
“this”关键字的作用域是内部函数,我无法引用任何组件成员