Question

我试图用不同范围变量的值填充同一个表。 A和B总是具有相同的长度。

＆＃13;

$scope.a = [1,2,3]
$scope.b = [4,5,6]

＆＃13;

<table>
  <thead>
    <tr>
      <th>A</th>
      <th>B</th>
    </tr>
  </thead>
  <tbody>
    <tr ng-repeat="itemA in a, itemB in b"> <!-- How should be this ng-repeat?-->
      <td>{{itemA}}</td>
      <td>{{itemB}}</td>
    </tr>
  </tbody>
</table>

＆＃13;

结果应该是一个表格：

A - B

1 - 4

2 - 5

3 - 6

Answer 1

如果我们可以假设两个数组总是具有相同的长度：

<table>
  <thead>
    <tr>
      <th>A</th>
      <th>B</th>
    </tr>
  </thead>
  <tbody>
    <tr ng-repeat="itemA in a track by $index"> 
      <td>{{itemA}}</td> <!--Could also be a[$index] -->
      <td>{{b[$index]}}</td>
    </tr>
  </tbody>
</table>

它所做的就是跟踪数组和索引，并使用该索引获取B中的必要元素。

Answer 2

我将两个数组放在一起并访问属性如下：

$scope.items = [{
    a: 1,
    b: 4    
}, {
    a: 2,
    b: 5    
}, {
    a: 3,
    b: 6    
}]

<tr ng-repeat="item in items">
  <td>{{item.a}}</td>
  <td>{{item.b}}</td>
</tr>

Answer 3

ng-repeat为内部范围添加了一些特殊值，包括$index，您可以使用它来引用b中的相应值。

<tr ng-repeat="itemA in a">
  <td>{{ itemA }}</td>
  <td>{{ b[$index] }}</td>
</tr>

在模板之外，您可以使用lodash's _.zip function：

之类的内容将数组压缩在一起

$scope.combinedArray = _.zip(a, b); // [[ 1, 4 ], [ 2, 5 ], [ 3, 6 ]]

用于填充表的倍数ng-repeat

3 个答案: