angularjstemplatesng-grid

ng-grid with no vertical bars

Trying to remove vertical bars between columns in ng-grid.

I grabbed the default rowTemplate, removed the div, and put it in gridOptions:

rowTemplate: '<div ng-style="{ \'cursor\': row.cursor }" ng-repeat="col in renderedColumns" ng-class="col.colIndex()" class="ngCell {{col.cellClass}}"><div ng-cell></div></div>',

which actually works, but how do I do the same for the header?

There's certainly some functionality for it:

<div class="ngVerticalBar ngVerticalBarVisible" ng-style="{height: col.headerRowHeight}" ng-class="{ ngVerticalBarVisible: !$last }" style="height: 30px;">&nbsp;</div>

but how do I access it?

Solution

  • like this?

            headerRowTemplate: '<div ng-style="{ height: col.headerRowHeight }" ng-repeat="col in renderedColumns" ng-class="col.colIndex()" class="ngHeaderCell"><div ng-header-cell></div></div>',

    Plunker