css - AngularJS:可滚动的提前输入字段

Question

我的 HTML

<div class="form-group">
    <label class='control-label col-md-4' for='id_paymentCurrency'>{{'PAYMENT_CURRENCY' | translate}}</label>
    <div class='col-md-4'> 
        <div id="scrollable-dropdown-menu">
        <input type="text" class="form-control" data-trim-value="false" ng-trim="false" id ='id_paymentCurrency' ng-model="vm.data.paymentCurrency"  typeahead-append-to-body="true" required
        typeahead-editable="false"
        uib-typeahead="currency.code for currency in vm.getCurrencies($viewValue)"ng-disabled="disabled" />
    </div>   
  </div>  
</div>  

我的 CSS

#scrollable-dropdown-menu .tt-menu {
   max-height: 150px;
   overflow-y: auto;
 }

我正在使用 angular-bootsrap 附带的 angular 1.x 和 typeahead，我无法使滚动条出现。

http://fiddle.jshell.net/H7LA4/46/

Answer 1

问题出在您的选择器上。试试这个:

#scrollable-dropdown-menu .dropdown-menu {
    max-height: 150px;
    overflow-y: auto;
}

您可以在此 fiddle 中检查它是否按预期工作