Событие Cytoscape cxttap вызывается несколько раз

Я пытаюсь создать сетевой рабочий процесс с помощью Cytoscape и AngularJS 1.6. После создания двух узлов пользователь может создать границу между ними. Для этого я использую функцию cy.on('cxttap')cytoscape, чтобы обнаруживать правые клики на обоих узлах, а затем вставлять новое ребро. Это прекрасно работает. Пока я не добавил новое представление, где пользователь может видеть сохраненные рабочие процессы из базы данных. Проблема в том, что если я открою вкладку «Просмотр», а затем вернусь на вкладку «Создание», функция cy.on('cxttap') будет вызвана дважды, и на холст цитоскейпа будут вставлены два ребра, но в моей переменной области видимости будет сделана только одна запись. Раньше у меня была одна и та же фабрика для обоих представлений, но теперь я использую разные угловые фабрики для каждого.

Если я открываю переключатель между этими вкладками несколько раз, количество раз, когда я открываю вкладку просмотра, - это количество раз, когда вызывается функция, следовательно, больше количество строк.

Здесь (https://jsfiddle.net/y47kwpg7/4/) фрагмент кода для обоих моих представлений с их контроллерами. «Просмотр создания» --> «MlalTextWorkflowGeneratorCtrl» и «Просмотр просмотра» --> «MlalTextWorkflowViewerCtrl».

(Пожалуйста, простите меня, я не знаю, как заставить его работать в одном файле)

У меня есть фабрика для холста цитоскейпа, и у меня есть аналогичная фабрика для другого представления, но с другим выбором идентификатора.

Спасибо за помощь!


person Varij Kapil    schedule 09.07.2017    source источник


Ответы (2)


Вам либо нужно

(1) удалить старые слушатели, если вы повторно используете экземпляр, или

(2) создавать новый экземпляр каждый раз, когда вы создаете новое представление.

person maxkfranz    schedule 10.07.2017
comment
Я создаю новый экземпляр каждый раз, когда создаю новое представление, но проблема, которую я обнаружил, заключается в том, что слушатели считываются, любые входные данные, как я могу удалить старые слушатели, прежде чем покинуть представление? - person Varij Kapil; 11.07.2017

Ответ @maxkfranz заставил меня немного больше отладить, и, наконец, я обнаружил проблему.

Проблема заключалась в том, что у меня были некоторые функции прослушивания, которые я вызывал из своего контроллера, чтобы обнаруживать события на узлах цитоскейпа. И слушатели для запуска были сохранены в переменной workflowGraph.listeners. вы можете увидеть старый код []1. Проблема заключалась в том, что эта переменная не очищалась каждый раз, когда мой контроллер перезагружался, потому что я вызывал слушателей из моего контроллера, и они снова добавлялись к этой переменной. Таким образом, у одного слушателя было несколько функций для вызова.

Метод, который я использовал для решения этой проблемы, заключался в создании новой функции типа «слушателя», которая у меня была ранее для событий цитоскейпа, которую я вызывал бы каждый раз при загрузке моего контроллера, чтобы очистить переменную слушателей для моей фабрики цитоскейпа.

На фабрике цитоскейпа

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

В контроллере

workflowCreation это название фабрики

  workflowCreation.reinitialize();

Это просто очистит переменную слушателей от фабрики.

Не забудьте вызвать это в своем контроллере после инициализации Cytoscape и перед вызовом любых других функций прослушивания

Надеюсь, это поможет кому-то.

person Varij Kapil    schedule 11.07.2017