角度jsでネストされたng-repeatを使用するようなフィードバック機能

Question

jsonデータを使用して、スターをクリックすると、現在の行のすべての星が選択された（CSS変更）ようなフィードバックを実現しようとしています。 5つ星のフィードバックでわかるように 私は現在、以下のコードで苦労しています。

$scope.itemClicked = function (status, job) { 
    if (status.isActive) { 
    status.isActive = false; 
    } else { 
    angular.forEach(job.statuscollection, function(status) { 
     status.isActive = false; 
    }); 
    status.isActive = true; 
    } 
} 

http://plnkr.co/edit/VA1XWWrG3pghEcWli06F?p=info

現在のコードは私が行の特定の項目を選択することができます

、私が望むすべては、現在の項目に沿って一列内のすべての先行項目のCSSを変更することです。

本当にありがとうございます。

おかげ

Answer 1

は、私はあなたが実際に探しているかわからないが、私はあなたが親インデックスとループの上限を使用して機能を実現することができると思います。コードデモンストレーションの例を次に示します。

<div ng-repeat="fb in feedback" ng-init="outerIndex = $index"> 
    {{fb.question}} 

    <br/> 
    <span style="margin-left:10px" ng-repeat="star in fb.stars" 
    ng-init="innerIndex = $index"> 
     <button class="btn btn-default" ng-class="{ 'btn-info': star.isActive === true}" ng-click="itemClicked(star, fb)"> {{star.icon}} </button> 
    </span> 

    <br/><br/> 
</div> 


    $scope.itemClicked = function (outer, inner) { 

     /* changing disabling all the items first */ 
      for(var loop = 0; loop < outer.stars.length; loop++){ 
      outer.stars[loop].isActive = false; 
      } 


     for(var loop = 0; loop < outer.stars.length; loop++){ 
      if(outer.stars[loop] !== inner) 
      outer.stars[loop].isActive = true; 
      else 
      break; 
     } 

      inner.isActive = true; 
     } 

http://plnkr.co/edit/1R9tqXM0yinvBQxfKNgD?p=preview

あなたはあなたの星のアイコンとボタンを置き換えることができます。お役に立てれば。