Lista rozwijana AngularJS + Bootstrap: nie można wykonać ng-click in ng-repeat

Question

Próbuję utworzyć próbnik z Bootstrap Dropdown i AngularJS.

http://jsfiddle.net/qbjfQ/

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

Gdy używam ng kliknij statycznie na liście, to działa w porządku (przykład 4 i 5) Ale gdy używam ng kliknij w NG-powtórzenia, to nie będzie aktualizować wartość (przykład 1 do 3)

Co mogę zrobić?

Answer 1

Jest to znany problem z zakresu w dyrektywach. Możesz przeczytać artykuł The Nuances of Scope Prototypal Inheritance, aby dowiedzieć się więcej o zakresie w kątowym js.

Trzeba zmienić ng-repeat do

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

Demo: Fiddle

Dla wyjaśnienia problemu, można przeczytać my answer do this question

Answer 2

Jedną z opcji jest użycie funkcji seter zasięgu ng-click

HTML:

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

JS

function MyCtrl($scope) { 

    $scope.list = [1,2,3]; 
    $scope.setCurrent=function(val){ 
     $scope.current =val; 
    }  
    $scope.current = 0;  
} 

DEMO: http://jsfiddle.net/qbjfQ/2/

Answer 3

Jest takie angularjs dyrektywa, która robi dokładnie to: https://gist.github.com/andyvr/5205764

Oto jsfiddle z przykładów: http://jsfiddle.net/M32pj/1/

Sample: 
<select ng-model="example1" bs-selectbox> 
<option value="1">One</option> 
<option value="2">Two</option> 
</select>