Question

有一个难以解决的错误的时间汇。我正在使用ui-select实现多选控制。

正如您在该网站的插图中所看到的，当您点击输入时，您将获得一个下拉列表。

通过我的尝试，当我点击输入时，我没有得到任何东西，除非我先点击列表，然后在列表下方约1厘米（这是实际ul所在的位置）。

否则，如果我开始输入（过滤和搜索），它确实有效。其他一切也都有效 - 选择和移除处理程序。

我甚至复制并粘贴了AngularJS UI团队在其网站上的内容。

<ui-select multiple ng-model="ctrl.multipleDemo.selectedPeople" theme="bootstrap" ng-disabled="ctrl.disabled" sortable="true" close-on-select="false" style="width: 800px;">
<ui-select-match placeholder="Select person...">{{$item.name}} &lt;{{$item.email}}&gt;</ui-select-match>
<ui-select-choices repeat="person in ctrl.people | propsFilter: {name: $select.search, age: $select.search}">
  <div ng-bind-html="person.name | highlight: $select.search"></div>
  <small>
    email: {{person.email}}
    age: <span ng-bind-html="''+person.age | highlight: $select.search"></span>
  </small>
</ui-select-choices>
</ui-select>

那么，为什么我必须点击实际的ul，而不是input（它在给定的数据中是如何工作的）？

进一步的信息。上面我提到我首先要点击input，然后点击它下方1厘米。这是因为点击ul时正在呈现input，但它的不透明度为0.我发现为什么会在选择的javascript代码中发生这种情况，但是将其注释掉了没有真正解决任何问题它适用于第一次点击，但所有后续点击需要再次低于1厘米（即在ul上）。

起初我认为我使用animate可能是原因，但我删除了该问题并且问题没有解决。

我准备了一个plunk，我已经确定了与我的项目有什么不同。我在debugger文件的第1455行添加了select.js语句。在随后的块中，输入事件的 $ animate api连接了一个处理程序。在plunk中，程序执行跟随到该处理程序（可能是因为事件被触发）。在我的项目中，它永远不会激发。这就是处理程序：

$select.$animate.on('enter', dropdown, function (elem, phase) {
if (phase === 'close' && needsCalculated) {
  calculateDropdownPosAfterAnimation();
  needsCalculated = false;
}
});

奇怪的是它永远不会开火。

任何帮助将不胜感激。欢呼声。

Answer 1

尝试以下代码......

<ui-select multiple ng-model="ctrl.multipleDemo.selectedPeople" 
theme="bootstrap"  sortable="true" close-on-select="false" style="width: 
 800px;">
 <ui-select-match placeholder="Select person...">{{$item.name}} &lt;
 {{$item.email}}&gt;</ui-select-match>
 <ui-select-choices repeat="person in ctrl.people | propsFilter: {name: 
  $select.search, age: $select.search}">
  <div ng-bind="''+person.age | highlight: $select.search | highlight: 
  $select.search"></div>
  </ui-select-choices>
 </ui-select>

供参考：https://codepen.io/mfunkie/pen/bKAaI

Answer 2

所以这是一个错误，并在ui-select GitHub页面上open issue。就我而言，我使用ngAnimate和multi-select功能。

ui-select不会在点击

2 个答案: