2017-02-19 43 views
0

這裏是我的問題plunker:http://plnkr.co/edit/9DsLidTZR7RJDEq6PW0H?p=previewangularjs UI的選擇禁用下拉列表,使其只搜索

我想使下拉菜單僅搜索:使用只看到下拉菜單項列表ONLY當用戶開始輸入時,只有包含輸入的單詞或多個字母的相應項目纔會出現在列表中,否則該列表根本不會顯示。

<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> 

回答

1

您可以使用ng-style和修改的選擇ul height屬性。不要認爲庫中有任何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> 

請告訴我們。

相關問題