Dynamic function name in Angular 2 click event

Question

While this answer is probably dead simple, I seem to be stuck. As an Angular 2 beginner, I have tried all possible combinations of {}, [] and () brackets to achieve the following:

<button (click)="this.action">Click me</button>

where:

this.action = "clickMe()"

i.e. it is a string, a name of the method in that component that should be executed on click.

Any ideas?

yurzui · Accepted Answer · 2016-12-17T12:18:29.950

20

You can use square bracket syntax like

(click)="this[action]()"

where

action="clickMe"

edited Dec 17 '16 at 12:18

answered Dec 17 '16 at 11:19

yurzui

205,937
32
433
399

just mention: the action should be the string of the method name – Xin Meng Mar 14 '19 at 15:26
This gives me an error like this `error TS7053: Element implicitly has an 'any' type because expression of type 'any' can't be used to index type 'Component'.` – Hirusha Fernando Jan 22 '23 at 16:21

Dynamic function name in Angular 2 click event

1 Answers1