angularjs ui-select 禁用下拉列表并使其仅可搜索

Question

这是我的问题的插件：http://plnkr.co/edit/9DsLidTZR7RJDEq6PW0H?p=preview

我想让下拉菜单只可搜索：只有当用户开始输入时，用户才能看到下拉项目列表，并且只有包含输入的单词或字母的相应项目才会出现在列表，否则根本不显示列表。

<ui-select ng-model="person.selectedValue" theme="select2" ng-disabled="disabled" style="min-width: 300px;" title="Choose a person">
    <ui-select-match placeholder="Select a person in the list or search his name/age...">{{$select.selected.value.name}}</ui-select-match>
    <ui-select-choices repeat="person.value as (key, person) in peopleObj | filter: {'value':$select.search}">
      <div ng-bind-html="person.value.name | highlight: $select.search"></div>
      <small>
        email: {{person.value.email}}
        age: <span ng-bind-html="''+person.value.age | highlight: $select.search"></span>
      </small>
    </ui-select-choices>
  </ui-select>

Answer 1

您可以使用 ng-style 并修改选项 ul 高度属性。不要以为库里有任何OOB解决方案

<ui-select-choices ng-style="($select.search != '')? {'height' : 'auto'}: {'height' : '0px'}" repeat="person.value as (key, person) in peopleObj | filter: {'value':$select.search}">
        <div ng-bind-html="person.value.name | highlight: $select.search"></div>
        <small>
        email: {{person.value.email}}
        age: <span ng-bind-html="''+person.value.age | highlight: $select.search"></span>
      </small>
</ui-select-choices>

让我们知道。

angularjs ui-select 禁用下拉列表并使其仅可搜索

angularjs ui-select disable dropdown list and make it only searchable

html

javascript

twitter-bootstrap

angularjs

ui-select