Обновление SelectElement с помощью ng-модели AngularJS с использованием Javascript для расширения Chrome?

#javascript #angularjs #dom #google-chrome-extension #angularjs-ng-model

Вопрос:

Я пытаюсь изменить значение элемента select на стороннем веб-сайте, используя расширение chrome, обычный ванильный javascript. Я не могу изменить HTML-код на веб-сайте.

Из того, что я могу сказать, элемент select управляется с помощью ng-модели. Кажется, я не могу обновить это!!

Я могу успешно обновить представление веб-сайта и обновить меню выбора. Однако, когда я нажимаю «Отправить», изменения в меню «Выбрать» не регистрируются. Я пытался отправить событие, но это не сработало. Вот мой код:

 // Select Number of Players
function selectPlayers(numPlayers) {
  num = numPlayers - 1;
  const sel = document.getElementById('pc');
  sel.selectedIndex = num;
  sel.dispatchEvent(new Event('sel', {'bubbles': true, 'cancelable': false }));
}
 

вот веб — сайт для справки:
https://cityofla.ezlinksgolf.com/index.html#/preSearch

Вот проверенный элемент ВЫБОРА:

 <select id="pc" class="preSearch-select-player ng-pristine ng-untouched ng-valid" ng-model="ec.selectedPlayer" ng-change="ec.onPlayerCountChanged(ec.selectedPlayer)" ng-options="player as player for player in ec.filterPlayers" title="Enter Players"><option label="1" value="string:1">1</option><option label="2" value="string:2">2</option><option label="3" value="string:3">3</option><option label="4" value="string:4" selected="selected">4</option><option label="5" value="string:5">5</option></select>
 

Спасибо, что посмотрели!