AngularJS: scrollable typeahead input field
<p>My HTML</p>

<pre><code>&lt;div class="form-group"&gt;
    &lt;label class='control-label col-md-4' for='id_paymentCurrency'&gt;{{'PAYMENT_CURRENCY' | translate}}&lt;/label&gt;
    &lt;div class='col-md-4'&gt; 
        &lt;div id="scrollable-dropdown-menu"&gt;
        &lt;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" /&gt;
    &lt;/div&gt;   
  &lt;/div&gt;  
&lt;/div&gt;  
</code></pre>

<p>My CSS</p>

<pre><code>#scrollable-dropdown-menu .tt-menu {
   max-height: 150px;
   overflow-y: auto;
 }
</code></pre>

<p>I'm using angular 1.x and typeahead that comes with angular-bootsrap, I can't make the scrollbar to appear. </p>

<p><a href="http://fiddle.jshell.net/H7LA4/46/" rel="noreferrer">http://fiddle.jshell.net/H7LA4/46/</a></p>