使用引导程序的自动查找功能(Plunker 附加)

Question

这里是 plunker- http://plnkr.co/edit/nMozzczMrbXJPfcps0A2?p=preview

如果您能注意到，我已经将下面的css类添加到自动查找功能中。

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

我没有在任何地方提到这个类。 引导程序会自动获取此 CSS 类并将其应用于我的下拉列表。

我不希望这种情况发生。 如何分配一个新类并将相同的属性分配给下拉菜单，如果我们键入任何字母表，下拉菜单会在 plunker 上弹出。

Answer 1

您可以通过覆盖下拉模板来分配新的 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" +
       "");
}]);

在这个例子中，我在下拉菜单类旁边添加了你的自定义类，并添加了CSS规则 - 背景：红色

普伦克：http://plnkr.co/edit/iMKsB5TULDYRcyfoYSek?p=preview