CODEWITHSUNDEEP
angularjsngtable
dschulten
dschulten

Reputation: 3152

Defining ngTable table header title attribute

In a default ngTable the title attribute of the headers is a single blank as in title=" ", which causes strange hover artifacts in IE and is not a good value from the accessibility perspective either. How can I define the title attribute of the table headers?

The blank title is caused by the headerTitle attribute of the column defaults in app.factory('ngTableColumn'):

var defaults = {
    'class': function(){ return ''; },
    filter: function(){ return false; },
    filterData: angular.noop,
    headerTemplateURL: function(){ return false; },
    headerTitle: function(){ return ' '; },
    sortable: function(){ return false; },
    show: function(){ return true; },
    title: function(){ return ' '; },
    titleAlt: function(){ return ''; }
};

Can I redefine the headerTitle function which is used to build the column?

See also Issue 561

Upvotes: 1

Views: 3661

Answers (1)

dschulten
dschulten

Reputation: 3152

One can specifically set the title attribute by adding "header-title" with a double quoted + single quoted value to the td:

<table ng-table class="table">
  <tr ng-repeat="user in users">
    <td data-title="'Name'" header-title="'Foo'">{{user.name}}</td>
    <td data-title="'Age'" header-title="'Bar'">{{user.age}}</td>
  </tr>
</table>

The header-title value on the td and all other defaults are evaluated in the directive definition and win over the defaults mentioned in the original question.

Upvotes: 2

Related Questions