UI-выберите с в нескольких режимах - как реализовать реакцию на клик для выбранного элемента?

Question

Я выбираю несколько элементов с помощью ui-select. Когда я нажимаю на один из выбранных элементов, я хочу открыть модальное окно. Я реализовал это так же, как функция ng-click в элементе ui-select-match.

<ui-select id="myselect" ng-model="myvar" theme="bootstrap" ng-required="true" multiple="" search-enabled="true" reset-search-input="true">
    <ui-select-match ng-click="myFunction()" placeholder="Click to select">{{$item}}
    </ui-select-match>
    <ui-select-choices repeat="item in ['one', 'two', 'three']">
      <div>{{item}}</div>
    </ui-select-choices>
  </ui-select>

мой JS выглядит так:

$scope.myFunction = function() {
  $uibModal.open({
   template: "Hi there!" 
  });
}

При нажатии моё модальное окно открывается, но у меня есть проблема: модальные окна открываются, когда я удаляю элемент, нажимая на x значок. Как я могу предотвратить это поведение?

Plunkr здесь: http://plnkr.co/edit/i4urNAa1u1rteXhfvAyd?p=preview

Answer 1

Попробуйте переместить ng-click внутри ui-select-match:

  <ui-select-match placeholder="Click to select">
    <a ng-click="myFunction()" > {{$item}} </a>
  </ui-select-match>