如何在另一个ng-repeat中使用ng-repeat范围

Question

所以我有一个对象数组：

expMonthByCat: 
    {Food: [some values],
     Clothing: [some values]
    }

我有一张桌子，看起来像：

<tr data-ng-repeat="category in labels">
    <th scope="row">{{category}}</th>
    <td data-ng-repeat="expCat in expMonthByCat">{{expCat}}</td>
</tr>

我需要<td data-ng-repeat="expCat in expMonthByCat">传递category ，因为类别包含Food，Clothing和我在expMonthByCat中拥有的其他键。

我尝试了<td data-ng-repeat="expCat in expMonthByCat.category">和<td data-ng-repeat="expCat in expMonthByCat.category"> <td data-ng-repeat="expCat in expMonthByCat">{{expCat.category}}</td>但是它不起作用。

有人可以帮我吗？ 谢谢！

编辑

这样的输出<td data-ng-repeat="expCat in expMonthByCat track by $index">是： 图像

其中作为输出<td data-ng-repeat="expCat in expMonthByCat.Food track by $index">{{expCat}}</td>为： 图像

如何获取表格以显示其各自的值？

我的JS代码：

$scope.expMonthByCat = {};
for (z = 0; z < $scope.labels.length; z++) {
    $scope.expMonthByCat[$scope.labels[z]] = new Array(12);
    for (x = 0; x < 12; x++) {
         $scope.expMonthByCat[$scope.labels[z]][x] = 0;
    }
}

for (x = 0; x < 12; x++){
    for (i = 0; i < response.data[2].length; i++) {
        $scope.labels.forEach(function (k) {
            if(response.data[2][i].category == k){
                if (response.data[2][i].expMonth == x + 1 && response.data[2][i].expYear == currentYear){
                    var expByCat = response.data[2][i].expAmount;
                    $scope.expMonthByCat[k][x] = parseFloat(Number(expByCat).toFixed(2));
                }
            }
        });
    }
}

Answer 1

我认为这是您需要的：

<tr data-ng-repeat="cat in labels">
    <th scope="row">{{cat}}</th>
    <td data-ng-repeat="expCat in expMonthByCat[cat]">{{expCat}}</td>
</tr>

检查工作演示： jsfiddle

Answer 2

您需要在一个表行上具有ng-repeat才能映射表中的所有标题，然后从那里开始我们需要嵌套的ng-repeat来映射属于该类别的所有项目。 您可以data-ng-repeat="(key,val) in labels"使用data-ng-repeat="(key,val) in labels"以获取data-ng-repeat="(key,val) in labels"的key 。

 angular.module('notesApp', []) .controller('MainCtrl', ['$scope', function($scope) { $scope.expMonthByCat = { Food: ['cake', 'burger'], Clothing: ['jeans', 't-shirt'] } $scope.labels = Object.keys($scope.expMonthByCat); }]); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script> <table border='1' ng-app="notesApp" ng-controller="MainCtrl"> <tr> <th scope="row" data-ng-repeat="category in labels">{{category}}</th> </tr> <tr data-ng-repeat="(key,val) in labels"> <td data-ng-repeat="expCat in expMonthByCat">{{expCat[key]}}</td> </tr> </table>