Question

我有这样的数组：

$scope.first = [ [ [ "a", "b", "c" ], [ "d", "e", "f" ] ], [ [ "g", "h", "i" ], [ "g", "k", "l" ] ], [ [ "m", "n", "o" ], [ "p", "q", "r" ] ], [ [ "s", "t", "w" ], [ "x", "y", "z" ] ] ];

我有这样的嵌套ng-repeat：

<div ng-repeat="seconds in first">
   <div ng-repeat="thirds seconds">
       <div ng-repeat="item in thirds">
           <span>{{item}}</span>
       </div>
   </div>
</div>

我要显示

1-A

2-B

3-C

4 d

5-F

........

25-y

我非常感谢你的帮助。

Answer 1

试试这个（html端解决方案）

＆＃13;

(function ()
{
    var app = angular.module("app", []);

    function HomeController()
    {
        var vm = this;
        vm.first = [
            [
                ["a", "b", "c"],
                ["d", "e", "f"]
            ],
            [
                ["g", "h", "i"],
                ["g", "k", "l"]
            ],
            [
                ["m", "n", "o"],
                ["p", "q", "r"]
            ],
            [
                ["s", "t", "w"],
                ["x", "y", "z"]
            ]
        ];
    }

    app.controller("HomeController", [HomeController]);

})();

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<!DOCTYPE html>
<html lang="en" ng-app="app">
    <head>
        <meta charset="UTF-8">
        <title>Angular JS App</title>
    </head>
    <body>

        <div class="container" ng-controller="HomeController as homeCtrl">
            <div ng-repeat="(firstIndex, seconds) in homeCtrl.first" ng-init="i = firstIndex">
                <div ng-repeat="(secondIndex, thirds) in seconds" ng-init="j = i * seconds.length+secondIndex">
                    <div ng-repeat="(thirdIndex, item) in thirds" ng-init="k = j * thirds.length+thirdIndex">
                        <span>{{k+1}}-{{item}}</span>
                    </div>
                </div>
            </div>
        </div>
    </body>
</html>

＆＃13;

Answer 2

我认为这可能就是你要找的东西，虽然我的最终价值是24-z，而不是25-y，所以那里出了问题。

以下是html方面（在第二次in电话中错过ng-repeat的仅供参考

{{ setCounterToZero() }}
<div ng-repeat="seconds in first">
    <div ng-repeat="thirds in seconds">
        <div ng-repeat="item in thirds">
            <span>{{ outputItem(item) }}</span>
            <br />
        </div>
    </div>
</div>

这是控制器的代码

$scope.first = [
    [
        ["a", "b", "c"],
        ["d", "e", "f"]
    ],
    [
        ["g", "h", "i"],
        ["g", "k", "l"]
    ],
    [
        ["m", "n", "o"],
        ["p", "q", "r"]
    ],
    [
        ["s", "t", "w"],
        ["x", "y", "z"]
    ]
];

$scope.counterValue = 0;

$scope.setCounterToZero = function () {
    $scope.counterValue = 0;
}

$scope.outputItem = function (item) {
    $scope.counterValue++;

    return $scope.counterValue + '-' + item;
}

这就是你要找的东西吗？

如何显示嵌套ng-repeat的索引

2 个答案: