Total Pageviews

2018/05/11

[Angular] How to add serial number in ng-grid

Problem
If I would like to add serial number in ng-grid, how to do it?
I would like to implement in client side instead of server side.

The column configuration in ng-grid is as bellows:
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
  $scope.tab4.synonymCols  = [{
            field : 'value',
            displayName : 'value',
            cellClass : 'text-left',
            width : '25%'
        }, {
            field : 'synonyms',
            displayName : 'synonyms',
            cellClass : 'text-left',
            width : '70%'
        } ];


How-To
The updated column configuration in ng-grid is as bellows:
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
       $scope.tab4.synonymCols  = [{
            field : 'seq',
            displayName : 'no',
            cellClass : 'text-left',
            width : '5%',
            cellTemplate: '<div class="ngCellText ng-scope col1 colt1" ng-class="col.colIndex()"><span ng-cell-text="">{{row.rowIndex + 1}}</span></div>'
        }, {
            field : 'value',
            displayName : 'value',
            cellClass : 'text-left',
            width : '25%'
        }, {
            field : 'synonyms',
            displayName : 'synonyms',
            cellClass : 'text-left',
            width : '70%'
        } ];





No comments: