коврик-слайдер не слушает getelementbyid

#javascript #angular #angular-material

Вопрос:

У меня есть проект angular, в котором я загрузил дополнительный javascript, включенный в файл angular.json в разделе de scripts. в этом файле js есть куча прослушивателей событий, в частности, этот:

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

Проблема, с которой я сталкиваюсь, заключается в том, что я использую коврик-слайдер вот так:

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

и кажется, что js не обнаруживает элемент ползунка мата с document.getElementById(«объем»). Если я использую классический тип ввода=»диапазон», все работает нормально.

Как я могу сделать так, чтобы коврик-слайдер тоже работал? Я надеюсь, что кто-нибудь сможет помочь мне с этим вопросом. (PS: я также попытался привязать ползунок мата к скрытому полю диапазона ввода, но у меня также возникли проблемы с запуском события таким образом. но, безусловно, полезный вариант, если это необходимо)

Комментарии:

1. Я думаю, что идентификатор работает только с собственными элементами, ползунок мата-это угловой компонент. идентификатор опускается, когда он печатается в dom

2. @FaizalHussain когда я добавляю идентификатор на коврик-слайдер и осматриваю элемент, я вижу его

3. возможно, вы пытаетесь получить доступ к элементу до того, как он будет скомпилирован?

4. На самом деле вам это совсем не нужно. У mat-слайдера уже есть (вход) и (изменение) излучатель, который вы можете использовать.

5. @MikeOne я попытался объяснить, что мне это нужно, потому что логика (которая является огромной частью приложения) выполняется в этом javascript. таким образом, обычные излучатели изменения входного сигнала от angular не будут работать