html - 更改 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-checked 添加到 .p-inputswitch 并添加 来将“选定”状态添加到选择器: :ng-deep 在选择器前面进行渗透 View Encapsulation :

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