Question

我有动态inputData数组（长度可以介于0到10或15之间），如下所示：

$scope.inputData = [
    [1, 2, 3, 4, 5, 6, 7];
    [1, 2, 3, 4, 5, 6, 7];
    [1, 2, 3, 4, 5, 6, 7];
    [1, 2, 3, 4, 5, 6, 7];
    [1, 2, 3, 4, 5, 6, 7];
    [1, 2, 3, 4, 5, 6, 7];
]

我需要在表格中使用ng-repeat生成td，这样我就可以在第一次迭代中从每个“子数组”中获得第一项。然后只有每个“子数组”中的第二项等。所以表应该是

th   th   th  th  th  th
1    1    1   1   1   1
2    2    2   2   2   2
3    3    3   3   3   3
...

并且ng repeat应该在每次迭代中切换索引。

// first iteration: 
<td ng-repeat="item in inputData track by $index">{{item[0]}}</td>
// second iteration: 
<td ng-repeat="item in inputData track by $index">{{item[1]}}</td>
...

我是否可以通过ng-repeat以某种方式解决这个问题，还是应该在控制器中对数组进行排序？

Answer 1

试试这个：

＆＃13;

angular.module('app', []).controller('ctrl', function($scope) {
  $scope.inputData = [
    [1, 2, 3, 4, 5, 6, 7],
    [1, 2, 3, 4, 5, 6, 7],
    [1, 2, 3, 4, 5, 6, 7],
    [1, 2, 3, 4, 5, 6, 7],
    [1, 2, 3, 4, 5, 6, 7],
    [1, 2, 3, 4, 5, 6, 7]
  ]
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js">
</script>

<table ng-app='app' ng-controller='ctrl'>
  <tbody>
    <tr ng-repeat='array in inputData' ng-init='parentIndex=$index'>
      <td ng-repeat='item in array'>{{array[parentIndex]}}
        <td>
    </tr>
  </tbody>
</table>

＆＃13;

Answer 2

 <!DOCTYPE html>
    <html ng-app="app">
    
      <head>
        <meta charset="utf-8" />
        <title>AngularJS Example</title>
        <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.3/angular.js" data-semver="1.4.3"></script>
        <script>
          var app = angular.module('app', []);
          app.controller('MainCtrl', function($scope) {
            var items = [
        [1, 2, 3, 4, 5, 6, 7],
        [1, 2, 3, 4, 5, 6, 7],
        [1, 2, 3, 4, 5, 6, 7],
        [1, 2, 3, 4, 5, 6, 7],
        [1, 2, 3, 4, 5, 6, 7],
        [1, 2, 3, 4, 5, 6, 7]
            ];
            
           $scope.items_transpose = transpose(items);
    
            function transpose(a) {
    
      // Calculate the width and height of the Array
      var w = a.length || 0;
      var h = a[0] instanceof Array ? a[0].length : 0;
    
      // In case it is a zero matrix, no transpose routine needed.
      if(h === 0 || w === 0) { return []; }
    
      /**
       * @var {Number} i Counter
       * @var {Number} j Counter
       * @var {Array} t Transposed data is stored in this array.
       */
      var i, j, t = [];
    
      // Loop through every item in the outer array (height)
      for(i=0; i<h; i++) {
    
        // Insert a new row (array)
        t[i] = [];
    
        // Loop through every item per item in outer array (width)
        for(j=0; j<w; j++) {
    
          // Save transposed data.
          t[i][j] = a[j][i];
        }
      }
    
      return t;
    }
            
          });
        </script>
      </head>
      <body ng-controller="MainCtrl">
        
        <table>
            <tr ng-repeat="item in items_transpose track by $index">
                <td ng-repeat="i in item track by $index">{{i}}</td>
            </tr>
        </table>
        
      </body>
    </html>

ng-repeat与数组数组

2 个答案: