Arrow from HeaderCell in Angular ui-grid

Question

I need to know whether or not it is possible to remove the down chevron arrow from the headercell of the Angular ui-grid (as seen below):

Because the Sort Ascending and Sort Descending in the dropdown selection does not behave the same as the sort when clicking on column headings in the grid. Clicking on column headings automatically overrides any previous sorting, whereas selecting Sort Ascending or Descending from the dropdown requires that the user selects "Remove Sort" before selecting another column. My QA Team has asked me to "remove" it as they fear it would cause a user to believe that there is something wrong with the sorting feature if the tried to select another Sort Asc/Desc without first clicking Remove Sort. If the arrow cannot be removed, is it at least possible to remove Sort Ascending and Descending from the selection without preventing sorting using the column headings?

Answer 1

In order to remove the Sort Ascending, Sort Descending and Remove Sort from the dropdown menu, I commented out the following in the ui-grid.js file:

  //{
        //  title: i18nService.getSafeText('sort.ascending'),
        //  icon: 'ui-grid-icon-sort-alt-up',
        //  action: function($event) {
        //    $event.stopPropagation();
        //    $scope.sortColumn($event, uiGridConstants.ASC);
        //  },
        //  shown: function () {
        //    return service.sortable( $scope );
        //  },
        //  active: function() {
        //    return service.isActiveSort( $scope, uiGridConstants.ASC);
        //  }
        //},
        //{
        //  title: i18nService.getSafeText('sort.descending'),
        //  icon: 'ui-grid-icon-sort-alt-down',
        //  action: function($event) {
        //    $event.stopPropagation();
        //    $scope.sortColumn($event, uiGridConstants.DESC);
        //  },
        //  shown: function() {
        //    return service.sortable( $scope );
        //  },
        //  active: function() {
        //    return service.isActiveSort( $scope, uiGridConstants.DESC);
        //  }
        //},
        //{
        //  title: i18nService.getSafeText('sort.remove'),
        //  icon: 'ui-grid-icon-cancel',
        //  action: function ($event) {
        //    $event.stopPropagation();
        //    $scope.unsortColumn();
        //  },
        //  shown: function() {
        //    return service.sortable( $scope ) &&
        //           typeof($scope.col) !== 'undefined' && (typeof($scope.col.sort) !== 'undefined' &&
        //           typeof($scope.col.sort.direction) !== 'undefined') && $scope.col.sort.direction !== null &&
        //          !service.suppressRemoveSort( $scope );
        //  }
        //},

Now, the only thing that shows in the dropdown menu is "Hide Column". This solved my issue.

Hope this helps someone else!