Font-Awesome Ng-grid Sorting

headerCellTemplate.html

<div class="ngHeaderSortColumn {{col.headerClass}}" ng-style="{'cursor': col.cursor}" ng-class="{ 'ngSorted': !noSortVisible }">
    <div ng-click="col.sort($event); sortOrder = !sortOrder;" ng-class="'colt' + col.index" class="ngHeaderText">
        <div ng-show="(!col.showSortButtonDown() && !col.showSortButtonUp())" class="fa fa-fw fa-sort"></div>
        <div class="fa fa-fw fa-sort-desc" ng-show="col.showSortButtonDown()"></div>
        <div class="fa fa-fw fa-sort-asc" ng-show="col.showSortButtonUp()"></div>
        {{col.displayName}}
    </div>
</div>
<div ng-show="col.resizable" class="ngHeaderGrip" ng-click="col.gripClick($event)" ng-mousedown="col.gripOnMouseDown($event)"></div>