ng-bootstrap-> Typeahead样式

Question

我似乎无法设置ng bootstrap typeahead的下拉菜单的样式。

输入本身的样式很好（组件仅包含输入/预输入），但下拉菜单不适用（使用插入的ngb-typeahead窗口以及该菜单的.dropdown-menu类进行尝试。

Answer 1

ng-bootstrap在更改组件方面非常有限。 我会说尝试使用template ，它是最接近自定义的模板 。 ng-bootstrap和ngx-bootstrap之类的插件是自定义组件，通常不支持可自定义性来扩展其他插件提供的扩展。

Answer 2

一个很好的答案在这里： https : //stackoverflow.com/a/51417049/4248983

tl; dr

• Typeahead窗口是一个动态添加的组件
• 实现Typeahead的组件将样式封装为仅自身
• 在@Component装饰器中设置encapsulation: ViewEncapsulation.None ，以允许全局访问您的组件样式

警告
设置ViewEncapsulation.None表示您的组件样式在全球可用。 确保您的CSS选择器足够具体，以防止影响应用程序中的其他元素！