css - ui-select with in multiple mode - 如何实现对所选项目的点击反应？

Question

我正在使用ui-select选择多个项目。当我单击一个选定的项目时，我想打开modal window。我将它实现为 ui-select-match 元素中的 ng-click 功能。

<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

尝试在 ui-select-match 中移动 ng-click：

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