如何覆盖Ng-Bootstrap样式中的样式并将html结构编辑为Typeahead

Question

我正在使用https://ng-bootstrap.github.io。我想用我的样式覆盖下拉菜单的样式，还更改typeahead组件的一些css标签，但似乎看不到在哪里做？

代码：

<input id="sys_id" type="text" formControlName="sys_id" class="form-input" [ngbTypeahead]="search"/>

例如，更改以下内容：

<ngb-typeahead-window class="dropdown-menu show" role="listbox" id="ngb-typeahead-0" style="position: absolute; top: 0px; left: 0px; transform: translate(199px, 354px);"><!----><!--bindings={
 </ngb-typeahead-window>

Answer 1

将这两行添加到 type-ahead-basic.ts 中将为其设置样式

::ng-deep .dropdown-menu.show { background:lightblue;}
::ng-deep .dropdown-item { color:red !important; }

您可以检查工作中的stackblitz here-告诉我是否有任何情况