Javascript 多次调用Cytoscape事件cxttap_Javascript_Angularjs_Cytoscape.js_Cytoscape Web

Javascript 多次调用Cytoscape事件cxttap

javascript angularjs

Javascript 多次调用Cytoscape事件cxttap,javascript,angularjs,cytoscape.js,cytoscape-web,Javascript,Angularjs,Cytoscape.js,Cytoscape Web,我正在尝试使用Cytoscape和AngularJS 1.6创建一个网络工作流创建两个节点后，用户可以在它们之间创建边。为此，我使用cy.on（'cxtap'）cytoscape函数来检测两个节点上的右键单击，然后插入一条新边。这个很好用。直到我添加了一个新视图，用户可以在其中查看数据库中保存的工作流。问题是，如果我打开查看选项卡，然后返回创建选项卡，则调用两次cy.on（'cxtap'）函数，在cytoscape画布上插入两条边，但在我的scope变量中只做了一个条目。我曾经对两个视图使用

我正在尝试使用Cytoscape和AngularJS 1.6创建一个网络工作流创建两个节点后，用户可以在它们之间创建边。为此，我使用

cy.on（'cxtap'）

cytoscape函数来检测两个节点上的右键单击，然后插入一条新边。这个很好用。直到我添加了一个新视图，用户可以在其中查看数据库中保存的工作流。问题是，如果我打开查看选项卡，然后返回创建选项卡，则调用两次

cy.on（'cxtap'）

函数，在cytoscape画布上插入两条边，但在我的scope变量中只做了一个条目。我曾经对两个视图使用相同的工厂，但现在我对每个视图使用不同的角度工厂

如果我多次打开这些选项卡之间的开关，打开查看选项卡的次数就是调用函数的次数，因此行数更多

这里（）是我的两个视图及其控制器的代码片段。“创建视图”->“MlalTextWorkflowGeneratorCtrl”和“查看视图”->“MlalTextWorkflowViewerCtrl”

（请原谅，我不知道如何在单个文件中工作）

我这里的工厂用于cytoscape画布，在另一个视图中有一个类似的工厂，但id选择不同

谢谢你的帮助

你要么需要

（1）如果正在使用实例，请删除旧侦听器，或者

（2）每次创建新视图时都要创建一个新实例。

您需要

（1）如果正在使用实例，请删除旧侦听器，或者

（2）每次创建新视图时都要创建一个新实例。

@maxkfranz的回答引导我进行更多的调试，最后我发现了问题所在

问题是我有一些监听器函数，我从我的控制器调用这些函数来检测cytoscape节点上的事件。要激发的侦听器存储在变量workflowGraph.listeners中。您可以看到旧代码[]。问题是这个变量没有在我的控制器重新加载时清空，因为我从我的控制器调用侦听器，它们再次被添加到这个变量中。因此，一个侦听器可以调用多个函数

我用来解决这个问题的方法是为cytoscape事件创建一个新的“listener”类型函数，我会在每次加载控制器时调用该函数，以清空cytoscape工厂的listeners变量

在cytoscape工厂

    workflowGraph.reinitialize = function () {
        workflowGraph.listeners = {};
    };

在控制器中

workflowCreation

是工厂的名称

  workflowCreation.reinitialize();

这只会清空工厂中的listeners变量

记住在cytoscape初始化之后和调用任何其他侦听器函数之前，在控制器中调用此函数

希望这对某人有所帮助。

@maxkfranz的回答引导我进行了更多的调试，最终我发现了问题所在