javascript - Angular bootstrap-select 在选择后继续显示选项

Question

我注意到 angular bootstrap select 中存在问题(演示部分)当您选择一个选项时，这个选项会继续显示选项而不是被隐藏。如果未使用 ng-model 属性，则此工作正常。

这是 EXAMPLE .

一段代码:

      <select toggle selectpicker ng-model="form">
          <option>Mustard</option>
          <option>Ketchup</option>
          <option>Relish</option>
      </select>

问候，

Answer 1

似乎在 li 列表项上的指令 angular-bootstrap-select.extra 中绑定(bind)的事件在 ng-model 附加到此时不会执行。原因是:- 在指令 angular-bootstrap-select 中，当模型值更改时，它调用 element.selectpicker('refresh'); 最终在刷新方法中删除并重新创建列表项，因此在 li 上的指令 angular-bootstrap-select.extra 中绑定(bind)的点击事件将丢失。您可以通过对父级使用事件委托(delegate)来快速修复。

尝试:

 element.next().on('click', 'li', function () {
       target.toggleClass('open')
});

代替:-

 element.next().find('li').bind('click', function () {
    target.toggleClass('open')
 })

Plnkr