I have am repeating the elements of two arrays with two separate
ng-repeat
<table>
<tbody ng-repeat="data in pTab track by $index" class="headerWrapper" ng-if="modelIsActive2( data, $index)">
<tr class="specHeaders" ng-repeat="headers in data.modelHeaders" ng-if="!$last">
<td class="specs2">{{headers}}</td>
</tr>
</tbody>
<tbody ng-repeat="data in pTab track by $index" class="specsWrapper" ng-if="modelIsActive2(data, $index)">
<tr class="specsWrapper" ng-repeat="modelArrays in data.modelData" ng-if="modelIsActive(modelArrays, $index)">
<td class="specNumbers" ng-repeat="mod in modelArrays track by $index" ng-if="!$last">
<p class="specValues2">{{mod}}</p>
</td>
</tr>
</tbody>
</table>
<theader>
<tbody>
<table>
<tr>
<div ng-repeat="data in pTab track by $index" class="headerWrapper" ng-if="modelIsActive2( data, $index)">
<div class="specHeaders" ng-repeat="headers in data.modelHeaders" ng-if="!$last">
<th class="specs2">{{headers}}</th>
</div>
</div>
</tr>
<tr>
<div ng-repeat="data in pTab track by $index" class="specsWrapper" ng-if="modelIsActive2(data, $index)">
<div class="specsWrapper" ng-repeat="modelArrays in data.modelData" ng-if="modelIsActive(modelArrays, $index)">
<div class="specNumbers" ng-repeat="mod in modelArrays track by $index" ng-if="!$last">
<td class="specValues2">{{mod}}</td>
</div>
</div>
</div>
</tr>
</table>
$scope.pTab = {
data: {
modelHeaders: ["specHeader1", "specHeader2", "specHeader3", "specHeader4"],
modelData: {
modelArray: ["spec1", "spec2", "spec3", "spec4"]
}
}
};
Take a look at this plnkr, I think it's showing what you want.
http://plnkr.co/edit/h9z5airokWFV5oxWt73z?p=preview
html:
<div ng-repeat="data in pTab">
<table>
<thead>
<tr>
<th ng-repeat="headers in data.modelHeaders">{{headers}}</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="modelArrays in data.modelData">
<td ng-repeat="specs in modelArrays">{{specs}}</td>
</tr>
</tbody>
</table>
</div>