Tengo un proyecto angular en el que cargué javascript adicional incluido en el archivo angular.json en la sección de scripts. en este archivo js hay un montón de detectores de eventos, en particular este:

 document.getElementById("volume").addEventListener("input", volChangeFunc, false)

El problema que tengo es que estoy usando mat-slider como este:

 <mat-slider id="volume" thumbLabel color="primary"></mat-slider>

y parece que js no detecta el elemento mat-slider con document.getElementById("volumen"). Si uso el tipo de entrada clásico = "rango", todo funciona bien.

¿Cómo puedo hacer que mat-slider también funcione? Espero que alguien pueda ayudarme con este problema. (PD: también intenté vincular el control deslizante de tapete a un campo de rango de entrada oculto, pero también tuve problemas para activar el evento de esta manera. Pero definitivamente es una opción útil si es necesario)