我正在尝试ion-range根据线框在我的应用程序中自定义。我尝试使用 --bar-background-active但似乎无法正常工作。请参考我下面的代码。由于条形背景也是蓝色的，因此我删除了color="primary"它，我需要将其更改为灰色以与线框对齐。ion-range attribute希望您能够帮助我。谢谢
线框
实际的 
.html
<ion-range
class="range-position"
min="1"
max="6"
dualknobs="true"
pin="false"
snaps="true"
ticks="false"
//removed the color="primary"
list="tickmarks"
[(ngModel)]="range"
(ionChange)="changeFunction($event)"
>
</ion-range>
.scss
ion-range {
--bar-background-active: #0e82c1;
--bar-background: gray;
--bar-height: 0.5px;
--knob-size: 18px;
display: block;
}
离子信息
Ionic:
Ionic CLI : 6.13.0
Ionic Framework : @ionic/angular 5.4.3
@angular-devkit/build-angular : 0.1000.8
@angular-devkit/schematics : 10.0.8
@angular/cli : 10.0.8
@ionic/angular-toolkit : 2.3.3
Cordova:
Cordova CLI : 10.0.0
Cordova Platforms : android 8.1.0, ios 5.1.1
Cordova Plugins : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 5.0.0, (and 21 other plugins)
Utility:
cordova-res : not installed
native-run : not installed
System:
NodeJS : v15.3.0
npm : 7.5.4
OS : Windows 10
