AngularJs ng-click event only triggered with literal arguments

Question

When I call within a ng-repeat group

<span ng-click="remove({{user.id}})">Delete</span>

the remove function is not called

but when I replace the expression by a literal argument it gets called (works properly):

<span ng-click="remove(123)">Delete</span>

The '{{user.id}}' expression is evaluated properly and has only integer values.

Anybody an idea what is going on? Same happens with anchor tags (with href="").

score 35 · Accepted Answer · answered Oct 13 '12 at 19:37

35

ng-click="remove(user.id)" should work, ng-click evaluate it content so you don't need interpolation

answered Oct 13 '12 at 19:37

Oh ok, thank you. What irritated me is that no exception was thrown and the html code looked absolutely ok, because the expression had been evaluated properly. – Sam Oct 13 '12 at 19:46
1

To be more specific, ngClick will run whatever string is inside it's quotes through $eval(). More information can be found here: http://docs.angularjs.org/api/ng.$rootScope.Scope#$eval – Ben Lesh Oct 14 '12 at 02:42

score 7 · Answer 2 · answered Oct 13 '12 at 19:37

7

You shouldn't use curly braces in the ng-click expressions. Try this instead:

<span ng-click="remove(user.id)">Delete</span>

And be sure to check the AngularJS expressions documentation: http://docs.angularjs.org/guide/expression

answered Oct 13 '12 at 19:37

2 Answers2