Quiero lograr que cada vez que se cambie el valor del input tipo range, se coloque el value en el div, lo que tengo es lo siguiente:
formulario.component.html
<div class="col-md-auto mt-4">
<label class="mr-4">Porcentaje<span class="text-danger">*</span></label>
<div class="box">
<div id="value"></div>
</div>
<input id="slider" class="slider" (change)="value()" type="range" min="1" max="100" value="50">
</div>
formulario.component.ts
value() {
var slider = document.getElementById('slider');
var val = document.getElementById('value');
console.log(slider);
console.log(val);
}
Por el momento solo estoy imprimiendo ambos elementos en consola, pero cuando coloco dentro del formulario.component.ts lo siguiente:
value() {
var slider = document.getElementById('slider');
var val = document.getElementById('value');
val.innerHTML = slider.value;
}
Me aparece el error "Property 'value' does not exist on type 'HTMLElement'.ts(2339)" y no sé cómo lograrlo, agradecería su ayuda.