4

Seems that this is a very common issue with angular. The substitutions happen, but the ng-click fails to click (or so it seems to not be called). Can someone tell me why this fails?

<ul>
     <li ng-repeat="color in colors"> 
         <a ng-click="chooseColor({{$index}})">{{color.name}}</a>
     </li>
</ul>

here is the fiddle.

It seems to be the {{$index}}. If i replace that with a static number, it works.

Note: found this question - but it was not helpful.

Community
  • 1
  • 1
nycynik
  • 7,371
  • 8
  • 62
  • 87
  • 3
    Quick note in using `$index` for changing a value in the scope. If you filter the original array using `| filter: sth` method (basically if you filter on the view), then the index on the view could be different than the actual, nonfiltered array. It is better to accept the value itself rather than the index. – Umur Kontacı Apr 03 '13 at 21:05

1 Answers1

14

The {{}} bits are used templating (interpolation). This should work for you:

ng-click="chooseColor($index)"

The ng-click directive is looking for real JavaScript code an Angular Expression, not text that it needs to interpolate.

Langdon
  • 19,875
  • 18
  • 88
  • 107
  • 1
    Note, ng-click requires an [Angular expression](http://docs.angularjs.org/guide/expression) (not JavaScript code). – Mark Rajcok Apr 04 '13 at 02:46