Angular ui-select не отображает список опций при включении в angular-ui-bootstrap modal

я столкнулся с этим (или чем-то подобным) с ngDialog. Я исправил свою проблему, добавив

нужно добавить атрибут: append-to-body="false" или, если вам нужно, измените CSS:

body > .ui-select-bootstrap.open {
    z-index: 1100; /* greater then ui bootstrap modal, that 1050 */
}

в $templateCache в нижней части select.js ui-select, первый шаблон - " bootstrap / choices.ТПЛ.html', в котором 'ng-show=\" $select.предметы.длина > 0\"' присутствует, что это делает, чтобы скрыть выпадающий список появлялся, когда нет выбора для отображения.

Я понял, что ваша проблема заключается в том, что когда ui-select рендеринг в модальном, коллекция (в вашем случае адреса) пуста, и поэтому ее длина равна 0, в результате добавляется класс " ng-hide элемент, вызывающий проблему.

мой способ взлома это просто удалить 'ng-show=\" $select.предметы.длина > 0\"', или измените его на 'ng-show=\" $select.предметы.длина >= 0\"'(что делает его бесполезным). Побочный эффект заключается в том, что выпадающий список будет показывать пустой банковский список, когда нет выбора для отображения. Мне скорее нравится боковой эффект, он дает пользователю уверенность в том, что список работает.

высота пустого списка, однако, слишком узкая, и поэтому я бы добавил класс css в сделайте пустой список немного выше:

.ui-select-choices{ min-height: 30px;}

У меня была такая же проблема, решил ее с:

<div class="row" ng-controller="*protopathyUISelectCtrl as ctrl*">
  <div class="form-group m-b-sm required col-md-4 col-xs-3" >
      <div class="input-group">
        <span class="input-group-addon">test</span>
        <ui-select ng-model="ctrl.country.selected" theme="bootstrap" title="Choose a country" ng-disabled="disabled" append-to-body="false">
          <ui-select-match placeholder="test">{{$select.selected.name}}</ui-select-match>
          <ui-select-choices repeat="country in ctrl.countries | filter: $select.search">
            <span ng-bind-html="country.name | highlight: $select.search"></span>
            <small ng-bind-html="country.code | highlight: $select.search"></small>
          </ui-select-choices>
        </ui-select>
      </div>
  </div>
</div>

Если вы измените строку:

<ui-select-choices repeat="address.name in addresses track by $index" refresh-delay="0">

http://plnkr.co/edit/ybGQ9utrxR2sr8JyVc3g?p=preview

он отображает имя адреса.

ошибка возникает здесь в select.js

(line 610: ctrl.searchInput.css('width', '10px');)

в этом случае входной тег имеет ширину: 10px. Вы можете щелкнуть в этой 10px-области - и она будет работать. Поскольку мы используем этот lib через bower-я исправил его, не касаясь источника следующим образом:

<ui-select-match placeholder="placeholder..." ng-class="{empty: !account.roles.length}">{{::$item.name}}</ui-select-match>

Итак, если массив модели пуст - просто сделайте ширину входного сигнала 100%. Мы используем тему 'select2'

.empty.ui-select-match + .select2-search-field,
.empty.ui-select-match + .select2-search-field input{
    width: 100% !important;
}

у меня была такая же проблема, я исправляю ее, добавляя атрибут append-to-body="false".

<ui-select title="Origem" ng-disabled="disabled" append-to-body="false">
 ...
</ui-select>

у меня была аналогичная проблема. Я решил это, заменив ng-show С ng-if

<button ng-click="toggle=!toggle">Toggle</button>
<div ng-if="toggle">
    <ui-select multiple ng-model="data.projectStatusArray" theme="bootstrap" ng-disabled="disabled" style="margin:0px;">
        <ui-select-match class="ui-font-medium" placeholder="Choose Filter"> {{$item.display_name}} </ui-select-match>
        <ui-select-choices repeat="fl.name as fl in filterByArray | filter: $select.search">
            {{fl.display_name}}
        </ui-select-choices>
    </ui-select>
</div>

у меня также была такая же проблема, поэтому я просто изменил:

append-to-body="true"

в:

append-to-body="false"

Я также встретил эту проблему при использовании ui-modal, и я решаю это, используя условие "ng-class" для :

модала.HTML-код ``

<ui-select ng-model="person.selected" theme="bootstrap" on-select="onSelect($item)" ng-click="select_open = true">
    <ui-select-match placeholder="制作者">{{$select.selected.name}}</ui-select-match>
    <ui-select-choices repeat="item in people | propsFilter: {name: $select.search, email: $select.search}" ng-class="{ 'select_open': select_open }">
        <div ng-bind-html="item.name | highlight: $select.search"></div>
        <small ng-bind-html="item.email | highlight: $select.search"></small>
    </ui-select-choices>
    <ui-select-no-choice>
        一致するものは見つかりませんでした。
    </ui-select-no-choice>
</ui-select>

``

app.js ``

$scope.onSelect = function(item) {
    $scope.open_select = false;
}

``

стиль.в CSS ``

.select_open {
    opacity: 1 !important;
}

``

надеюсь, что это помогает.