Javascript AngularJS中的二维数组$Index

我正在开发一个AngularJS应用程序，它用

ng repeat

函数构建的2D数组构建电子表格。我目前正在编写一个函数，当用户在电子表格中输入新值时，该函数将更改数组的初始值。这要求我根据初始数组的行索引和列索引访问该点，以便将其更改为新值

我查看了，发现它有一个

$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>

数据=[
[A1，B1，C1]，
[A2，B2，C2]，
[A3、B3、C3]
]
sheet=函数（$scope$parse）{
$scope.columns=[colA，colB，colC]；
$scope.rows=data.length；
$scope.cells={}；
$scope.outer=data.map（函数（c，行）{
返回c.map（函数（数据，索引）{
返回{
内容:数据,，
型号：空，
};
});
});
};
{{column}}

我想在

内部

循环中访问

外部

的

$index

，也可以访问

内部

的

$index

。

---

有办法做到这一点吗？我计划将这些值作为参数传递给我正在编写的函数。

哈哈，好吧，在我整理提琴的时候，评论中已经回答了这个问题，但下面是一个演示，供后来发现这个问题的人使用：

{{cell}}（{{$index}，{{{$parent.$index}}）

这是我的代码，也许它会帮助您或找到将2D数组循环成两个ng重复元素的方法的人。 HTML代码

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

Javascript代码：

$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;
    }
});

<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>

$scope.gameData=[
[1, 0, 0],
[1, 0, 0],
[1, 0, 0],
[1, 0, 0]
];
$scope.presentCellsData=function（）{
var Str=“”；
var行=[]；
var项=[]；
对于（i=0；i<$scope.gameData.length；i++）{
Str=“”；
行数=”；
对于（j=0；j<$scope.gameData[i].length；j++）{
console.log（“i j”+i+”+j）；
log（$scope.gameData[i][j]）；
Str=”“+$scope.gameData[i][j]+”；
行数+=Str；
}
行+=“
”；
push（{“id”：i，“data”：rows}）；
}
控制台日志（术语）；
回报期；
}
$scope.gameMatrix=$scope.presentCellsData（）；
元素（文档）.ready（函数（）{
对于（i=0；i<$scope.gameMatrix.length；i++）{
console.log（“$scope.gameMatrix[i]”）；
log（$scope.gameMatrix[i]）；
document.getElementById（“cell_389;”+i）.outerHTML=$scope.gameMatrix[i]。数据；
}
});

@Karen:谢谢你，我可以用你的代码来处理我的数据：

$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;
    }
});

<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>

{{cell}}

也许有一个更直截了当的答案，但我可能只是开始检查ng repeat，也许您可以编写自己的指令，专门为您处理此情况。这是一个好问题。

$parent.$index

或者可能是

$parent（）。$index

-这两个选项中的一个应该有效。

$parent.$index

有效。谢谢我得到了“不允许在中继器中重复”的结果，通过添加“track by$index”解决了这个问题（）