2

И висит на каждом div обработчик, но когда будет таких div-элементов 100 штук.

Например: есть какая-то директива, или что-то такое, чтоб 1 раз где-то написать обработчик, и всё, чтоб не вставлять его в каждый div?

Вот есть чуть дивов:

<div (click)="checkInfo()">
  <ul>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
  </ul>
</div>
<div (click)="checkInfo()">
  <ul>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
  </ul>
</div>
<div (click)="checkInfo()">
  <ul>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
  </ul>
</div>
<div (click)="checkInfo()">
  <ul>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
  </ul>
</div>
<div (click)="checkInfo()">
  <ul>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
  </ul>
</div>

5
  • Можно: добавить для всех блоков родителя, на него повесить клик и в методе уже разбирать на что кликнули; если все блоки одинаковые - ngFor, условно, i = 0; i < 10; добавлять блоккам класс и написать метод на js который добавит слушатели и в onInit его вызывать
    – InDevX
    17 ноя 2020 в 23:27
  • @InDevX типу родителю добавить клик, и в методе написать if e .target == 'какой блок надо' то выполнять, так я понял? 17 ноя 2020 в 23:37
  • Да, верно понял
    – InDevX
    17 ноя 2020 в 23:51
  • т.е. вам нужно пробегать не по массиву, а в зависимости от какого-то числа создавать определённое количество блоков? 18 ноя 2020 в 8:54
  • @МихаилКамахин нет. например у меня в html есть уже 10 блоков. и надо повесить евенти на каждый 18 ноя 2020 в 20:26

1 ответ 1

0

Если блоки одинаковые, как указано в примере, то скорее всего их данные можно разместить в массиве, а после отобразить через директиву ngFor, и в ней же на каждый блок в цикле навесить метод (click), и передать в него аргументом элемент из цикла, чтобы была привязка к конкретной записи.

<div *ngFor="let item of items" (click)="checkInfo(item)">
  <ul>
    <li>{{item | json}}</li>
    <li></li>
    <li></li>
    <li></li>
  </ul>
</div>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.