ui-select 里面的可点击区域是 10px 一个 bootstrap 模态

Question

我有一个 bootstrap 模式，在它里面，我有一个 ui-select 用于标记。这是我的例子：

<div class="modal modal-invite">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <ui-select multiple tagging tagging-label="" ng-model="email_list" theme="bootstrap" ng-disabled="disabled" on-select="" on-remove=""  title="Insert your friends email here." >
          <ui-select-match placeholder="Your friends email here...">{{$item}}</ui-select-match>
          <ui-select-choices repeat="email in email_list | filter:$select.search">
            {{email}}
          </ui-select-choices>
        </ui-select>
      </div>
      <div class="modal-footer">
        <button class="btn btn-success">Invite</button>
      </div>
    </div>
  </div>
</div>

我的问题是：当我用 $('modal-invite').modal('show') 打开模式时，占位符（和可点击区域）的大小是 10 像素，如下所示：

点击后得到正确的宽度
如何让 ui-select 在模式打开时刷新它的大小？

Answer 1

最后我解决了检查 ui-select 来源。
似乎 ui-select 在父宽度上使用 $watch 重新计算输入大小。

所以，为了刷新它，我这样做了：

$('.modal-invite').modal('show');
$scope.$apply();

Answer 2

我有类似的问题。

我知道更改源文件不是好的做法，最好以某种方式从我自己的代码中定位它 - 但现在我通过注释掉源代码中设置输入字段的一行来修复它渲染标签时为 10px。

在源select.js文件的第831行，注释掉：ctrl.searchInput.css('width', '10px');

ui-select 里面的可点击区域是 10px 一个 bootstrap 模态

clickable area of ui-select inside is 10px a bootstrap modal

javascript

css

twitter-bootstrap

angularjs

ui-select