2017-01-21 5 views
0

あなたが気づくことができれば、私は自動検索機能にCSSクラスの下に追加されているplunker- http://plnkr.co/edit/nMozzczMrbXJPfcps0A2?p=preview自動検索機能(Plunkerが付属)

です。

.dropdown-menu { 
background-color:white; 
overflow:scroll; 
height:300px; 
} 

私はどこでもhtmlでこのクラスを言及しません。ブートストラップは自動的にこのcssクラスを受け取り、それを私のドロップダウンに適用します。

私はこれが起こりたくありません。どのように私は新しいクラスを割り当てると私たちがアルファベットを入力する場合は、プランナーでポップアップドロップダウンメニューに割り当てられている同じプロパティを持っています。

答えて

0

あなたは、テンプレートドロップダウンオーバーライドすることによって、新しいCSSクラスを割り当てることができます。私はドロップダウンメニュークラスの隣にあなたのカスタムクラスクラスを追加し、CSSを追加しました。この例では

angular.module('ui.bootstrap.demo', ['ngAnimate', 'ui.bootstrap']) 
    .run(["$templateCache", function($templateCache) { 
    $templateCache.put("template/typeahead/typeahead-popup.html", 
     "<ul class=\"dropdown-menu your-custom-class\" ng-show=\"isOpen() && !moveInProgress\" ng-style=\"{top: position().top+'px', left: position().left+'px'}\" style=\"display: block;\" role=\"listbox\" aria-hidden=\"{{!isOpen()}}\">\n" + 
     " <li ng-repeat=\"match in matches track by $index\" ng-class=\"{active: isActive($index) }\" ng-mouseenter=\"selectActive($index)\" ng-click=\"selectMatch($index)\" role=\"option\" id=\"{{::match.id}}\">\n" + 
     " <div uib-typeahead-match index=\"$index\" match=\"match\" query=\"query\" template-url=\"templateUrl\"></div>\n" + 
     " </li>\n" + 
     "</ul>\n" + 
     ""); 
}]); 

をルール - 背景:赤

プランナー:http://plnkr.co/edit/iMKsB5TULDYRcyfoYSek?p=preview