ng-select angular 5在悬停时更改选项列表中的项目的背景颜色

Question

我正在尝试更改选项列表中项目的背景颜色：hover。我注意到在悬停时有一个标记的类被添加到div标签。

我在使用ng-select组件的角度组件中有这个：

 ng-select {
    .ng-option {
      .marked {
        background-color: red;
      }
    }
  }

它不起作用。处理ng-select

时悬停时更改背景颜色的最佳方法是什么

Answer 1

在您的css / scss文件中：

.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked {
    background-color: red;
}

不要忘记在您的style.scss中导入ng-select样式。

// Import ng-select component styles
@import "~@ng-select/ng-select/themes/default.theme.css";

如果您希望在悬停时更改下拉按钮的颜色，请使用：

.ng-select .ng-select-container:hover{
    background-color: yellow;
}

Answer 2

我使用scss我将css从ng-select转换为scss，然后导入了scss文件并在任何地方进行了更改。希望这会有所帮助。