ng-重复遍历3个具有不同属性的数组

Question

我正在创建一个表格，我可以显示3个数组的数据（2个具有相同的属性，1个不同）。

<table class="table table-striped table-condensed table-hover">
   <thead>
     <tr ng-bind-html="head">                                    
     </tr>
   </thead>
   <tbody>
     <tr ng-repeat="item in book[bigCurrentPage]">                                    
      <td ng-bind="{{row.item1}}"></td>
      <td ng-bind="{{row.item2}}"></td>
      <td ng-bind="{{row.item3}}"></td>
      <td ng-bind="{{row.item4}}"></td>
      <td ng-bind="{{row.item5}}"></td>
      <td ng-bind="{{row.item6}}"></td>
      <td ng-bind="{{row.item7}}"></td>                                             
     </tr>
    </tbody>
   </table>

$scope.row = { item1: "item.code", item2: "item.name" };
$scope.row = { item1: "item.num", item2: "item.name", item3: "item.category", item4: "item.location.name", item5: "item.toloc.name", item6: "item.department", item7: "item.adm", item8: "item.person.name" };

第一个数组有7个属性（num，name，category，location，department，adm，person），其他2个数组有2个属性（代码，名称）

问题在于，当我连续使用2个单元格时，其他单元格仍然可见而没有任何内容。有没有办法让一个表可以使用不同属性和属性的ngRepeat数组？

解决方案：

<table class="table table-striped table-condensed table-hover">
  <thead>
    <tr ng-bind-html="head"></tr>
  </thead>
  <tbody ng-include=activeTable>                                
  </tbody>
</table>

<script type="text/ng-template" id="assets.html">
  <tr ng-repeat="item in book[bigCurrentPage]">
   <td ng-bind=item.num></td>
   <td ng-bind=item.name></td>
   <td ng-bind=item.category></td>
   <td ng-bind=item.location.name></td>
   <td ng-bind=item.department></td>
   <td ng-bind=item.adm></td>
   <td ng-bind=item.person.name></td>
 </tr>
</script>

<script type="text/ng-template" id="persons.html">
 <tr ng-repeat="item in book[bigCurrentPage]">
   <td ng-bind=item.code></td>
   <td ng-bind=item.name></td>
 </tr>
</script>

<script type="text/ng-template" id="locations.html">
 <tr ng-repeat="item in book[bigCurrentPage]">
    <td ng-bind=item.code></td>
    <td ng-bind=item.name></td>
 </tr>
</script>

$scope.assetshow = function () {
        $scope.asse = true;
        $scope.pers = false;
        $scope.loca = false;
        $scope.bigTotalItems = $scope.copy.data.assets.length;               
        $scope.book = PageItems($scope.copy.data.assets, 17);            
        console.log($scope.bigCurrentPage)
        $scope.row = { item1: "item.num", item2: "item.name", item3: "item.category", item4: "item.location.name", item5: "item.toloc.name", item6: "item.department", item7: "item.adm", item8: "item.person.name" };
        $scope.head = '<th>Asset code</th><th>Asset name</th><th>Category</th>'
                      + '<th>Location</th><th>Department</th><th>Administration</th><th>Person in charge</th>';
        $scope.activeTable = "assets.html";
    },
    $scope.locationshow = function () {
        $scope.asse = false;
        $scope.pers = false;
        $scope.loca = true;
        //produce pages.
        $scope.bigTotalItems = PageItems($scope.copy.data.locations);
        $scope.book = PageItems($scope.copy.data.locations, 17);            
        $scope.head = '<th>Kods</th><th>Nosaukums</th>';
        $scope.row = { item1: "item.code", item2: "item.name" };
        $scope.activeTable = "locations.html";
    },
    $scope.personshow = function () {
        $scope.asse = false;
        $scope.pers = true;
        $scope.loca = false;
        //produce pages.
        $scope.bigTotalItems = PageItems($scope.copy.data.persons);
        $scope.book = PageItems($scope.copy.data.persons, 17);
        $scope.head = '<th>Kods</th><th>Nosaukums</th></tr>';
        $scope.row = { item1: "item.code", item2: "item.name" };
        $scope.activeTable = "persons.html";
    };

通过更改activeTable字符串值表内容的更改。

DEMO： plnkr