web-dev-qa-db-ja.com

AngularJS + Bootstrapドロップダウン：ng-repeatでng-clickを実行できません

Bootstrap DropdownとAngularJSを使用してピッカーを作成しようとしています。

http://jsfiddle.net/qbjfQ/

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

リストで静的にng-clickを使用すると、正常に機能します（例4および5）が、ng-repeatでng-clickを使用すると、値が更新されません（例1から3）。

私に何ができる ？

drop-down-menutwitter-bootstrapangularjsng-repeat
9
Thibs

これは、ディレクティブのスコープに関する既知の問題です。記事 スコーププロトタイプ継承のニュアンス を読んで、angular jsのスコープについて詳しく知ることができます。

ng-repeatをに変更する必要があります

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

デモ： フィドル

問題の説明については、 私の答え から この質問 を読むことができます

27
Arun P Johny

1つのオプションは、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;    
}

デモ： http://jsfiddle.net/qbjfQ/2/

3
charlietfl

まさにそれを行うangularjsディレクティブがあります： https://Gist.github.com/andyvr/5205764

例を含むjsfiddleは次のとおりです。 http://jsfiddle.net/M32pj/1/

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