操作行を操作行に制限するAngularJS

Question

ng-changeによってトリガーされるアクションをユーザーが操作する行に限定する方法が見つかりません。したがって、ユーザーがドロップダウン1で「リーグ」を選択した場合、「使用可能なアイテム」列に別のドロップダウンが表示されます。現在、ユーザーが行1を操作すると、表のすべてのドロップダウンがアクションの影響を受けます。私が必要とするのは、ユーザーが操作する行だけにアクションを制限することです。フィドル：https://plnkr.co/edit/kAiLw40hUvnLk9jv86aj?p=preview

<div class="col-md-12 limitObjects"> 
<h4>Limit Object: </h4> 
    <div style="overflow: auto; max-height: 500px; height: 100%"> 
    <table border="0" class="table-bordered myTable" > 
    <tbody> 
    <tr ng-repeat="item in userMappings" ng-model="item"> 
     <td class="col-md-4"> 
     {{item.idsport}}, Game Type {{item.idgametype}}, {{item.name}} (Current limit {{item.value}}) {{item.mapped}} 
     </td> 
     <td class="col-md-3 mapType" style="padding-bottom: 25px; padding-left: 15px" > 
     <h4>Mapping Type: <span style="font-size:0.8em">{{mapping.name}}</span> </h4> 
     <select ng-model="mapping" ng-change="which(mapping, $index, event)" ng-options="mapping.name for mapping in mappingType" se-change=''></select> 
     </td> 
     <td class="col-md-4" style="padding-bottom: 25px; padding-left: 10px"> 
     <h4>Available Items:</h4> 
     <select ng-show="buau" ng-model="sport" ng-change="getID(sport, $index, $event); table($event)" ng-options="sport.name for sport in sportsList"></select> 
     <select ng-show="buau == false" ng-model="sportLeague" ng-change="getLeaguecategories(sportLeague, $index, $event)" ng-options="sportLeague.name for sportLeague in sportsList" style="float: left;"></select> 
     <select ng-show="!buau" ng-model="selectedLeague" ng-change="getID(selectedLeague, $index)" ng-options="selectedLeague.name for selectedLeague in leagueList.response" ></select> 
    </td> 
    </tr> 
    </tbody> 
</table> 
</div> 

<script> 
$scope.mappingType = [{name: "Sport"}, {name: "League"}, {name: "No Mapping"}]; 

$scope.sportsList = [{id : 34, name : "[Default]"}, {id: 15, name : "Alpine Skiing"}, { id : 8, name : "American Football" }, { id : 23, name : "Australian Rules"}]; 

$scope.userMappings = [{"id":"1","idgametype":"81","idsport":"NFL","mapped":"0","name":"Side","online":"1","profilelimitkeyid":"1","value":"3000"},{"id":"2","idgametype":"81","idsport":"NFL","mapped":"4","name":"Total","online":"1","profilelimitkeyid":"1","value":"3000"},{"id":"3","idgametype":"81","idsport":"NFL","mapped":"0","name":"IfBets","online":"1","profilelimitkeyid":"1","value":"500"},{"id":"4","idgametype":"81","idsport":"NFL","mapped":"0","name":"MoneyLine","online":"1","profilelimitkeyid":"1","value":"2000"},{"id":"5","idgametype":"81","idsport":"NFL","mapped":"1","name":"Parlays","online":"1","profilelimitkeyid":"1","value":"700"},{"id":"6","idgametype":"81","idsport":"NFL","mapped":"0","name":"Related","online":"1","profilelimitkeyid":"1","value":"0"},{"id":"7","idgametype":"81","idsport":"NFL","mapped":"0","name":"Reverses","online":"1","profilelimitkeyid":"1","value":"500"},{"id":"8","idgametype":"81","idsport":"NFL","mapped":"2","name":"Teasers","online":"1","profilelimitkeyid":"1","value":"0"}]; 

$scope.buau = true; 

$scope.which = function(mapping, index) { 
if (mapping.name === "Sport"){ 
    $scope.buau = true;  
} else if (mapping.name === "League") { 
    $scope.buau = false; 
} else if (mapping.name === "No Mapping"){ 

} 
</script> 

Answer 1

ここでの問題は、あなたがすべての行のためのあなたのng-show条件で同じ変数を使用しているということですので、すべての行が常に一緒に変化するであろうと自然なことです。あなたは、あなたは、各項目には、固有のだそのようにマッピング/ buauプロパティを装着している。この

<select ng-model="item.mapping" ng-change="which(item, $index, event)" ng-options="mapping.name for mapping in mappingType" se-change=''></select> 

<select ng-show="item.buau" ng-model="sport" ng-change="getID(sport, $index, $event); table($event)" ng-options="sport.name for sport in sportsList"></select> 

<select ng-show="item.buau == false" ng-model="sportLeague" ng-change="getLeaguecategories(sportLeague, $index, $event)" ng-options="sportLeague.name for sportLeague in sportsList" style="float: left;"></select> 

<select ng-show="!item.buau" ng-model="selectedLeague" ng-change="getID(selectedLeague, $index)" ng-options="selectedLeague.name for selectedLeague in leagueList.response" ></select> 

のようにNGリピートで各項目にプロパティを追加することによってこの問題を解決し、あなたはコントローラだでできます。期待どおりに動作しますが、https://plnkr.co/edit/rENbv8h3Pp7tm82YLpQS?p=preview