css - 样式 ng2-bootstrap 的 typeahead list-items

Question

问题:

我希望结果彼此下方(全宽)并且不具有透明背景。我右键单击其中一个元素并单击“检查”，这样我就想出了将什么用作选择器。

我尝试过的:

ul.dropdown-menu li {
background-color: black !important;
opacity: 1 !important;
color: yellow !important;

没有改变任何东西，所以要么我没有选择正确，要么我不知道。我有一个自定义模板:

<template #customItemTemplate let-model="item" let-index="index">
    <h5 style="width: 100%">{{model.title || model.name}}</h5>
</template>

但即使是行内样式也没有改变任何事情。

问题:

如何设置结果样式？

附言:我认为提及我正在使用 MaterializeCSS 可能会有用。

Answer 1

我在 v1.3.1 中为 TypeaheadDirective 公开了 optionsListTemplate 输入这样您就可以完全覆盖预先输入的结果模板；)默认的源代码你可以在这里查看: https://github.com/valor-software/ng2-bootstrap/blob/development/src/typeahead/typeahead-container.component.ts#L22-L32