// //html部分
<tbody ng-repeat="node in vm.stationName">
<tr ng-repeat="tr in node.items track by $index">
<td ng-if="$index ==0" rowspan="{{node.items.length}}">{{node.name}}</td>
<td>{{tr.vC_SHOW_NAME}}</td>
<td>{{tr.h3 | number:1}}</td>
<td>{{tr.h6 | number:1}}</td>
<td>{{tr.h9 | number:1}}</td>
</tr>
</tbody>
vm.tabledata数据格式
JS实现部分
vm.arrdata = [];
angular.forEach(vm.tabledata, function (data, index, arr) {
vm.arrdata.push(data.vC_STATIONNAME);
})
vm.staName = [];
angular.forEach(vm.arrdata, function (data, index, arr) {
if (vm.staName.indexOf(data) == -1) {
vm.staName.push(data);
}
})
vm.stationName = [];
angular.forEach(vm.staName, function (data, index, arr) {
vm.statitle = { name: '', items: [] };
vm.statitle.name = data;
vm.stationName.push(vm.statitle);
})
angular.forEach(vm.stationName, function (dataA, indexA, arrA) {
angular.forEach(vm.tabledata, function (dataB, indexB, arrB) {
if (dataA.name == dataB.vC_STATIONNAME) {
dataA.items.push(dataB);
}
})
});
JS自动生成表格
//html部分
<table>
<thead></thead>
<tbody id="j-tbody"></tbody>
</table>
//去掉数组重复项
function unique(arr) {
arr = arr || [];
var obj = {},
ret = [];
for (var i = 0, ilen = arr.length; i < ilen; i += 1) {
var curItem = arr[i],
curItemType = typeof (curItem) + curItem;
if (obj[curItemType] !== 1) {
ret.push(curItem);
obj[curItemType] = 1;
}
}
return ret;
}
//动态创建表格
var html;
angular.element('#j-tbody').html('');
for (var i = 0; i < vm.stationName.length; i++) {
for (var j = 0; j < vm.stationName[i].items.length; j++) {
html += '<tr class="j-number" data-num="' + vm.stationName[i].items[j].vC_STATIONNAME + '" data-len="' + vm.stationName[i].items.length + '">' +
'<td>' + vm.stationName[i].items[j].vC_SHOW_NAME + '</td>' +
'<td>' + vm.stationName[i].items[j].h3 + '</td>' +
'<td>' + vm.stationName[i].items[j].h6 + '</td>' +
'<td>' + vm.stationName[i].items[j].h9 + '</td>' +
'</tr>';
}
}
angular.element("#j-tbody").html(html);
//取得要合并单元格的值
var rets = [];
angular.element('.j-number').each(function () {
var num = angular.element(this).attr('data-num');
rets.push(num);
});
var newArrs = unique(rets),
domElems = angular.element('.j-number');
//再次遍历新数组
for (var m = 0; m < newArrs.length; m++) {
for (var n = 0; n < domElems.length; n++) {
var elemNum = angular.element(domElems[n]).attr('data-num'),
elemLen = angular.element(domElems[n]).attr('data-len');
if (newArrs[m] == elemNum) {
var td = '<td rowspan="' + elemLen + '">' + elemNum + '</td>';
angular.element(domElems[n]).prepend(td);
break;
}
}
}