title: AngularJS: scrollable typeahead input field
body: <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>