как по умолчанию показывать mat-slider-ticks

Я хочу показать mat-slider-ticks по умолчанию, как только просмотр загружается.

Но, к сожалению, галочки появляются только тогда, когда я нахожу на него курсор или выбираю его. Ниже приведен код:

<mat-slider class="width" [disabled]="false" [max]="max" [min]="min" [step]="step"
  [tickInterval]="tickInterval" [(ngModel)]="value" (change)="updatedInterval()">
</mat-slider>

А ниже отображается коврик-слайдер:

<mat-slider 
  _ngcontent-ihs-c288="" 
  role="slider" 
  class="mat-slider mat-focus-indicator width mat-accent mat-slider-has-ticks mat-slider-horizontal mat-slider-min-value ng-pristine ng-valid ng-touched" 
  ng-reflect-disabled="false" 
  ng-reflect-is-disabled="false"
  ng-reflect-max="60" 
  ng-reflect-min="30" 
  ng-reflect-step="0.1" 
  ng-reflect-tick-interval="50"
   ng-reflect-model="30" 
  tabindex="0" 
  aria-disabled="false" aria-valuemax="60" aria-valuemin="30" aria-valuenow="30" aria-orientation="horizontal">
  <div class="mat-slider-wrapper">
    <div class="mat-slider-track-wrapper">
      <div class="mat-slider-track-background" ng-reflect-ng-style="[object Object]" style="transform: translateX(7px) scale3d(1, 1, 1);"></div>
      <div class="mat-slider-track-fill" ng-reflect-ng-style="[object Object]" style="transform: translateX(-7px) scale3d(0, 1, 1); display: none;"></div>
    </div>
    <div class="mat-slider-ticks-container" ng-reflect-ng-style="[object Object]" style="transform: translateX(-8.33333%);">
      <div class="mat-slider-ticks" ng-reflect-ng-style="[object Object]" style="background-size: 16.6667% 2px; transform: translateZ(0px) translateX(8.33333%); padding-left: 7px;"></div>
    </div>
    <div class="mat-slider-thumb-container" ng-reflect-ng-style="[object Object]" style="transform: translateX(-100%);">
      <div class="mat-slider-focus-ring"></div>
      <div class="mat-slider-thumb"></div>
      <div class="mat-slider-thumb-label">
        <span class="mat-slider-thumb-label-text">30</span>
      </div>
    </div>
  </div>
</mat-slider>

И, пожалуйста, укажите, что я не хочу менять CSS глобально. Я хочу добавить CSS в соответствующий компонент.

0 ответов

Другие вопросы по тегам