Angular 6 JQuery Вложенные атрибуты Событие Click не работает - PullRequest
Новая
       14

Angular 6 JQuery Вложенные атрибуты Событие Click не работает

0 голосов
/ 27 января 2019

Добавление прослушивателя кликов в jQuery не работает.Похоже, что вложенные атрибуты, созданные в HTML, не выбираются jQuery для добавления прослушивателя

Я пытался добавить прослушиватель в ngOnInit(), но он не работает.

HTML Code 

<ul class="list-unstyled dropdown-content" id="search_dropdown">
  <span *ngFor="let merchant of merchants">
    <li [ngClass]="{ active: isActive(merchant) }">
      <a href="" (click)="selectMerchantFromMenu($event, merchant)">{{merchant.name}}</a>
    </li>
  </span>
</ul>

Код машинописного текста 

$(document).ready(() => {
  $("#search_dropdown span li a").on("click", function(e) {
    e.preventDefault();
    alert($(this));
    $("#search_input").val($(this).text());
  });
});

1 Ответ

0 голосов
/ 27 января 2019

Код, который вы указали, выполняется только на document.ready, и это происходит один раз, до того, как инициируется angular.Размещение этого кода в ngOnInit вызовет document.ready после его выполнения и ничего не даст.

Размещение этого кода вне угла может вызвать другую проблему.запрос ($("...")) выполняется один раз, и прослушиватель событий будет применен к найденным элементам.Но document.ready выполнит код перед угловой сборкой кода, поэтому он ничего не найдет.

Я бы порекомендовал вам взять код вне document.ready и использовать .on(events, selector, handler): 

ngOnInit() {
  $(document).on("click", "#search_dropdown span li a", function(e) {
    e.preventDefault();
    alert($(this));
    $("#search_input").val($(this).text());
  });
}

Но я очень рекомендую вам не использовать jquery с angular.В Angular есть все, что вам может понадобиться, без загрузки дополнительной библиотеки.

...