Javascript 从滑块'；单杠级数

我想为垫子滑块拇指标签选择一个值，为水平条进度选择另一个值

这里是我所期望的（我已经使用devtools得到了结果

我注意到我应该更改

mat slider track background

==>灰线和

mat slider track fill

=>黄线的css值

我不知道如何通过编程实现，因为黄色条的值是从父组件动态发送的，而条形html组件是mat slider的子组件，所以我无法从模板文件设置类

<mat-slider
    class="example-margin"
    [disabled]="false"
    [invert]="invert"
    [max]="max"
    [min]="min"
    [step]="step"
    [thumbLabel]="true"
    [tickInterval]="tickInterval"
    [(ngModel)]='value'
    [vertical]="vertical">
</mat-slider>

在我的ts文件中，我有第二个值和滑块参数：

export class SliderConfigurableExample {
  value2= 60; <== I would like this to be the bar value
}

导出类滑块配置示例{
value2=60；组件的设计基于一个由拇指和轨迹填充表示的单一值。这两个元素的显示不可配置，除非可能通过黑客攻击-但即使这样，我也不认为这是可能的，因为位置绑定到单一值。可以通过更改
mat滑块轨迹-背景
和
mat滑块轨迹填充
css类（可以使用devtools）因此，我认为可以在代码中更改它。您可以在开发工具中更改它，但我认为当值更改时，它不会一直保持更改。转换样式绑定在MatSlider中。每次滑块值更改时，这些元素上的样式标记都会更新。您是否从组件内部进行了更改？请共享您的代码。我在我的示例中，我使用matSlider作为图表，因此我阻止了游标事件（只读模式），这意味着我不会遇到您指出的问题