2D 배열 $ Index in AngularJS

Question

ng-repeat 함수로 작성된 2D 배열에서 스프레드 시트를 만드는 AngularJS 앱에서 작업하고 있습니다. 나는 현재 사용자가 스프레드 시트에 새로운 값을 입력 할 때 배열의 초기 값을 변경하는 함수를 작성하고있다. 이를 위해서는 행 인덱스와 열 인덱스를 기반으로 초기 배열의 포인트에 액세스해야하므로 새 값으로 변경할 수 있습니다.

나는 ng-repeat API을 살펴본 결과 $index 속성이있어서 현재 반복되는 값의 색인을 확인할 수 있음을 알았습니다. 그러나, 나는 단지 내가 당신이 내부에 어떤 반복 루프의 값의 인덱스를 확인하게됩니다 것을 발견하고 -. 다른 외부 루프 당신은 또한에있을 수

<script> 

    data = [ 
      [A1, B1, C1], 
      [A2, B2, C2], 
      [A3, B3, C3] 
      ] 

    sheet= function($scope, $parse){ 
    $scope.columns = [colA, colB, colC]; 
    $scope.rows = data.length; 
    $scope.cells = {}; 
    $scope.outer = data.map(function(c,row){ 
     return c.map(function(data, ind){ 
      return { 
       content: data, 
       model: null, 
      }; 
     }); 
    }); 
    }; 
</script> 


<div ng-app ng-controller="sheet"> 
    <table> 
     <tr class="column-label"> 
      <td ng-repeat="column in columns">{{column}}</td> 
     <tr ng-repeat="inner in outer"> 
      <td class="row-label" ng-repeat="data in inner"> 
       <div> 
        <input type="text" ng-model="data.content" value="{{data.content}}"> 
       </div> 
      </td> 
     </tr> 
    </table> 
</div> 

나는 $index에 액세스하려면 inner 루프 내에 있고 inner의 $index에 액세스 할 수도 있습니다. 이렇게하는 방법이 있습니까? 필자가 작성한 함수에 이러한 값을 매개 변수로 전달할 계획입니다. 내가 함께 내 바이올린을 넣는 동안

Answer 1

하하는 잘, 그것은 코멘트에 대답했지만, 여기에 길 아래에이 질문을 찾는 사람들을위한 그것의 데모입니다 : 여기

http://jsfiddle.net/V8qzt/1/

<div ng-controller="MyCtrl"> 
    <table> 
     <tr ng-repeat="row in data"> 
     <td ng-repeat="cell in row"> 
      {{cell}} ({{$index}},{{$parent.$index}}) 
      </td> 
     </tr> 
    </table> 
</div> 

Answer 2

은 내 코드입니다. 아마도 2D 배열을 두 개의 반복 요소로 루프하는 방법을 찾는 사람이나 도움이 될 것입니다. HTML 코드

<div ng-repeat="row in gameMatrix track by $index"> 
    <div id=cell_{{row.id}}> 
    </div> 
</div> 

자바 스크립트 코드 :

$scope.gameData = [ 
    [1, 0, 0], 
    [1, 0, 0], 
    [1, 0, 0], 
    [1, 0, 0] 
]; 

$scope.presentCellsData = function() { 
    var Str = ""; 
    var rows = []; 
    var term = []; 
    for (i = 0; i < $scope.gameData.length; i++) { 
     Str = ""; 
     rows = ""; 
     for (j = 0; j < $scope.gameData[i].length; j++) { 
      console.log("i j " + i + " " + j); 
      console.log($scope.gameData[i][j]); 
      Str = "<div style='display:inline-block'> " + $scope.gameData[i][j] + "&nbsp;</div>"; 
      rows += Str; 
     } 
     rows += "</br>"; 
     term.push({ "id": i, "data": rows }); 
    } 
    console.log(term); 
    return term; 
} 

$scope.gameMatrix = $scope.presentCellsData(); 
angular.element(document).ready(function() { 
    for (i = 0; i < $scope.gameMatrix.length; i++) { 
     console.log("$scope.gameMatrix[i]"); 
     console.log($scope.gameMatrix[i]); 
     document.getElementById("cell_" + i).outerHTML = $scope.gameMatrix[i].data; 
    } 
}); 

@Karen :

<div style="display: inline-block;" ng-repeat="row in gameData track by $index"> 
     <!-- <div id=cell_{{row.id}}> 
      aaa 
     </div> --> 
     <div ng-repeat="cell in row track by $index"> 
      {{cell}} 
     </div> 
    </div>