1

I am using materialized range:

<div class="range-field  col s6">
  <input type="range" id="test5" min="0" max="100"  #ranger (input)="yourMethod(ranger.value)"/>
</div>

This input creates in HTML span tag with class thumb, how could I change the color dynamically by changing the range? Is it possible to define in css .thumb {background-color: somevariable}, and change it from the component?

Sergey Vladimirovich
  • 479
  • 1
  • 8
  • 15

1 Answers1

2

You can dynamically set the color in html through a variable defined in the component.

<p [style.color]="variable"></p>

define the value of variable in component. But make sure you have a default value defined otherwise it will throw an error.

Rachit Shroff
  • 125
  • 6