Angular 5: динамическое связывание событий

Question

Как добавить динамический прослушиватель событий к динамическому элементу, т. Е. После того, как его рендеринг выполнен с помощью ответа службы?Мне нужно добавить динамический прослушиватель событий к определенному элементу, используя некоторый селектор, такой как идентификатор элемента.

Вариант использования: Предположим, у меня есть два элемента, оба рендеринга с использованием * ngFor поверх JSON из ответа службы, скажем:

Первый элемент Второй элемент

Теперь первый элемент JSON содержит несколько инструкций, с помощью которых мне нужно создать динамическую функцию, и мне нужно привязать эту вновь созданную функцию к моему второму div.Мне нужно сделать это, используя Angular 5, а не ванильный скрипт

Позвольте мне в три простых шага объяснить, что мне нужно сделать:

1) Сделать динамическую функцию с помощью json (может быть несколько функцийнеобходимо создать для разных элементов) 2) Нахождение моего элемента, который необходимо связать (необязательно) 3) Добавить динамическую функцию к соответствующим элементам, используя прослушиватель некоторых событий

Answer 1

Мы можем использовать привязку событий для захвата различных событий, инициируемых пользователем, для запуска логики в нашем классе компонентов.

<!-- From: -->
<input type="submit" class="btn" value="{{ btnText }}">

<!-- To: -->
<input type="submit" class="btn" value="{{ btnText }}" (click)="addItem()">