JQuery mouse onclick inside angularjs

Question

Я работаю со страницей, где используются как JQuery, так и AngularJS. Использование jQuery taggable-text.js-плагина Я могу выбрать элементы «Share-with» с помощью мыши и клавиатуры.

Но когда я пытаюсь выбрать элементы внутри таблицы (в области AngularJS), я могу сделать это только с помощью кнопок клавиатуры.

Может кто-нибудь сказать, почему событие onclick не срабатывает в пределах AngularJS, но другие?

Следующие события были прикреплены (строки 296-303 в JSFiddle JS блока):

this.listView = new ListView($list, this); 
this.strategies = strategies; 
this.$el.on('keyup', bind(this.onKeyup, this)); 
this.$el.on('keydown', bind(this.listView.onKeydown, this.listView)); 
this.$el.on('mousedown', bind(this.listView.onKeydown, this.listView)); 
this.$el.on('keydown', bind(this.onKeydown, this)); 
this.$el.on('keydown', 'button', bind(this.onButtonKeydown, this)); 
this.$el.on(fireChangeOn, bind(this.onChange, this)); 

Вот ссылка на JSFiddle, где вы можете увидеть полный код.

http://jsfiddle.net/sahak_k/k455Lx3f/5/

Answer 1

Вот один из возможных способов решения, чтобы решить проблему мыши щелчка. Вы можете вручную привязать и обработать событие OnMouseDown. код доступен в JSFiddle:

http://jsfiddle.net/k455Lx3f/7/

Я добавил переменную isAngularJS в коде. Когда эта переменная установлена ​​«истина» функция onClickAngularJS будет приложена, в противном случае - источник OnClick функции (строки 602-613):

var ListView = (function() { 
    function ListView($el, completer, isAngularJS) { 
     this.$el = $el; 
     this.index = 0; 
     this.completer = completer; 
     if (!isAngularJS) { 
      this.$el.on('click', 'li.textcomplete-item', bind(this.onClick, this)); 
     } else { 
      this.$el.on('mousedown', 'li.textcomplete-item > a', bind(this.onClickAngularJS, this)); 
     } 
    } 
... 

плюс вам понадобится собственный клик функции (на якорный элемент) обработки (строки 721-730):

onClickAngularJS : function(e) { 
    var $e = $(e.target); 
    e.originalEvent.keepTextCompleteDropdown = true; 
    if(!$e.hasClass('textcomplete-item')) { 
     $e = $e.parents('li.textcomplete-item'); 
    } 
    var selectedIndex = parseInt($e.data('index')); 
    this.completer.onSelect(this.data[selectedIndex]); 
    e.preventDefault(); 
} 

... 

и, наконец, необходимо указать параметр 'isAngularJS' в конфигурации (строки 766-770):

... 
var isAngularJS = false; 
if (config.isAngularJS && config.isAngularJS === true) { 
    isAngularJS = true; 
} 
new Completer(this, config.strategies, fireChangeOn, isAngularJS); 
...