AngularJS + Bootstrap Dropdown : can't do ng-click in ng-repeat

Question

I'm trying to create a picker with Bootstrap Dropdown and AngularJS.

http://jsfiddle.net/qbjfQ/

<li ng-repeat="item in list"><a ng-click="current = item">Dynamic set {{item}}</a></li>

When I use ng-click statically in the list, it works fine (example 4 and 5) But when I use ng-click in ng-repeat, it won't update the value (example 1 to 3)

What can I do ?

Answer 1

It is a known problem with scoping in directives. You can read the article The Nuances of Scope Prototypal Inheritance to learn more about the scoping in angular js.

You need to change the ng-repeat to

<li ng-repeat="item in list">
  <a ng-click="$parent.current = item">
    Dynamic set {{item}}
  </a>
</li>

Demo: Fiddle

For explanation of the problem, you can read my answer to this question