javascript - Angular ui Bootstrap typeahead - 添加类，当附加到正文时

Question

我在我的项目中使用 Angular Bootstrap typeahead。并且有几个正在使用它的实例。

http://angular-ui.github.io/bootstrap/#/typeahead

其中几个使用选项“typeahead-append-to-body”直接附加到正文，因此对于一个实例，我需要自定义演示文稿，即可以仅向该特定实例添加一个 css 类，即添加到ul，它创建的下拉菜单。但我无法做到这一点，因为我找不到任何方法。如果将其附加到输入元素的父级，这会很容易，但是当附加到主体时，似乎很困难。

<input type="text" typeahead-append-to-body="true" typeahead="state as state.name for state in statesWithFlags | filter:{name:$viewValue}" typeahead-template-url="customTemplate.html">

我不想直接使用 body > .dropdown-menu 进行定位，因为它也会影响其他实例。

Answer 1

我终于意识到，我可以简单地使用针对我正在使用的 html 模板的 css 属性选择器。

借助输入 typeahead 中提到的属性“typeahead-template-url = 'mysearchdropdownpage.html'”，我在 css 中编写了以下内容。

HTML

<input type="search" typeahead="searchItem for searchItem in searchTypeAhead" typeahead-template-url = 'mysearchdropdownpage.html' />

CSS

ul.dropdown-menu[template-url='mysearchdropdownpage.html']

而且效果很好。