更改 primeng 输入开关的颜色

Question

我有以下 p-inputSwitch。

<p-inputSwitch class="ml-1 mr-1 align-middle"
               (onChange)="setDefaultValues($event)"
               [ngModel]="defaultValuesToggle">
</p-inputSwitch>

有没有办法在选中时将颜色从蓝色更改？我尝试了以下方法，但颜色没有任何改变：

.p-inputswitch {
    background: red !important;
}
.p-inputswitch .p-inputswitch-slider {
  background: red !important;
}

Answer 1

需要在.p-inputswitch中添加classp-inputswitch-checked，在选择器前面添加::ng-deep来穿透View Encapsulation:

::ng-deep .p-inputswitch.p-inputswitch-checked .p-inputswitch-slider {
  background: purple;
}

更改 primeng 输入开关的颜色

Change color of primeng input-switch

html

css

primeng