Angularjs dynamic ng-click binding?

Question

I am reading a Json file and dynamically creating the elements using angular template.I wanted to bind the event to ng-click which is mentioned in the json file,but it throws exception.Kindly help. Thanks in Advance.

 <button id="{{controls.id}}" ng-click='{{controls.onAction}}' title="{{controls.tooltipText}}"
                                        ng-mouseover="mouseOver(this)" ng-mouseout="mouseOut(this)" style="font-size: 70%;
                                        border: none; border-spacing: 1px;" class="button">
                                        <img src="{{controls.imageSrc}}" class="image{{tabBoxes.Type}}" id="Img1" />
                                        {{controls.label}}
                                    </button>

Better you paste code here..as we are not mind readers

Trialcoder
– Trialcoder

2014-09-11 04:21:10 +00:00
Commented Sep 11, 2014 at 4:21 — Trialcoder
– Trialcoder, Commented Sep 11, 2014 at 4:21

Community · Accepted Answer · 2017-05-23 12:05:49Z

0

Create a $scope.onAction() function in the controller, and change ng-click as follows:

ng-click='onAction()'

Update in response to comment:

Since the functions are strings, use eval(), e.g.:

$scope.onAction = eval('(' + functionAsString + ')');

See this answer on SO on how to use eval() in JS.

edited May 23, 2017 at 12:05

CommunityBot

11 silver badge

answered Sep 11, 2014 at 4:44

Steve Lang

5594 silver badges8 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Sankar Rajmen Over a year ago

Thanks for your reply.But in my application every button has different onaction methods.the function is a string from json and i m trying to map as click function.how to do.

Sankar Rajmen Over a year ago

Thanks again the eval is not working for me.but i have found another way to do it. var act = new Function(e.onAction); act();

Collectives™ on Stack Overflow

Angularjs dynamic ng-click binding?

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related