角度双列表更改滚动条轨道颜色

Question

我正在使用AngularDualListBoxModule：

import { AngularDualListBoxModule } from 'angular-dual-listbox';

，我想将滚动条的颜色从蓝色更改为绿色（如上图所示）。

实际DualList

实际html代码

....

<dual-list [source]="mySrc" [(destination)]="xpto" 
  height="191px" [format]="format" key="id" display="nome"
  (destinationChange)="DoSomeThing($event)">
</dual-list>

....

我该怎么做？

答案：使用基于angular-dual-listbox的Custom DualList（link to）。

现在，我可以在“共享的”组件文件夹中使用和配置自定义组件。

Answer 1

最简单（但可能不是最正确）的方法是添加如下内容：

在组件的scss / css文件中

::ng-deep :host scroll-bar-css-selector {
  background-color: green;
}

其中 scroll-bar-css-selector 是该滚动条的CSS选择器。 当然，该样式将是全局样式，但是其选择器将绑定到您的组件，因此它将仅影响组件内部的滚动条。 希望有帮助。