angular_通过指令单元格合并实现

jsp指令使用

<table class="table table-bordered table-hover" id="tb">

<tbody>

<tr data-ng-repeat="data in pagedResultInfo.list" >

<td data-ng-click="ckEvent(this,'{{data.certificateRequisition.id}}', data);" >

</td>

<tddata-rowspan="2"name="data.certificateRequisition.id" style="vertical-align: middle;text-align: center;">{{data.certificateRequisition.userName}}</td>

</tr>

</tbody>

</table>

指令：

app.directive('rowspan', [function ()

var rowspanElements = {};

return {

restrict: 'A',

scope : {

name : "=",

rowspan : "="

},

link: function(scope, element, attrs) {

var name = scope.name, rowspan = scope.rowspan;//

var reo = rowspanElements[rowspan];

var preName = reo ? reo['preName'] : null, //

rowspanCount = 1, //

$rowspanElement = reo ? reo['$rowspanElement'] : null;

if (preName == null || preName != name) {

$rowspanElement = element;

rowspanElements[rowspan] = {};

rowspanElements[rowspan]['$rowspanElement'] = $rowspanElement;

rowspanElements[rowspan]['rowspanCount'] = rowspanCount = 1;

} else if(preName == name) {

element.remove();

}

rowspanCount = rowspanElements[rowspan]['rowspanCount']++;

$rowspanElement.attr("rowspan", rowspanCount);

rowspanElements[rowspan]['preName'] = name;

}

};

}]);