feat(header): header-class attribute is now a data binding expression

Previously the header-class attribute was added to a th element as a string literal.
Now the header-class attribute is supplied as a binding expression which has access
to the column definition.

This is a start in a move toward a design where TD element attributes are expressions
that have access to the scope.

BREAKING CHANGE:

Previously, a css class was added to TH elements thusly:

````
<tr ng-repeat="row in $data">
	<td header-class="myHeaderClass"></td>
</tr>
````

Now:

````
<tr ng-repeat="row in $data">
	<td header-class="'myHeaderClass'"></td>
</tr>
````

src/ng-table/header.html

@@ -8,7 +8,7 @@
         ng-click="sortBy(column, $event)"
         ng-show="column.show(this)"
         ng-init="template = column.headerTemplateURL(this)"
-        class="header {{column.class}}">
+        class="header {{column.class(this)}}">
         <div ng-if="!template" ng-show="!template" ng-bind="parse(column.title)"></div>
         <div ng-if="template" ng-show="template" ng-include="template"></div>
     </th>

src/scripts/05-directive.js

@@ -74,7 +74,7 @@ app.directive('ngTable', ['$compile', '$q', '$parse',
                         id: i++,
                         title: parsedTitle,
                         sortable: parsedAttribute('sortable', false),
-                        'class': el.attr('x-data-header-class') || el.attr('data-header-class') || el.attr('header-class'),
+                        'class': parsedAttribute('header-class', ''),
                         filter: filter,
                         filterTemplateURL: filterTemplateURL,
                         filterName: filterName,

test/tableSpec.js

@@ -112,13 +112,13 @@ describe('ng-table', function() {
             '<script type="text/ng-template" id="ng-table/filters/money.html"></script>' +
             '<table ng-table="tableParams" show-filter="true">' +
             '<tr ng-repeat="user in $data">' +
-            '<td data-title="\'Name of person\'" filter="{ \'name\': \'text\' }" sortable="\'name\'" data-header-class="customClass">' +
+            '<td data-title="\'Name of person\'" filter="{ \'name\': \'text\' }" sortable="\'name\'" data-header-class="getCustomClass(column)">' +
             '{{user.name}}' +
             '</td>' +
-            '<td x-data-title="\'Age\'" sortable="\'age\'" x-data-header-class="customClass">' +
+            '<td x-data-title="\'Age\'" sortable="\'age\'" x-data-header-class="getCustomClass(column)">' +
             '{{user.age}}' +
             '</td>' +
-            '<td title="\'Money\'" filter="{ \'action\': \'money\' }" filter-data="money($column)" header-class="customClass">' +
+            '<td title="\'Money\'" filter="{ \'action\': \'money\' }" filter-data="money($column)" header-class="getCustomClass(column)">' +
             '{{user.money}}' +
             '</td>' +
             '</tr>' +
@@ -127,7 +127,16 @@ describe('ng-table', function() {
 
         scope = $rootScope.$new(true);
 
-        scope.money = function() {
+        scope.getCustomClass = function(column){
+            if (column.title(scope).indexOf('Money') !== -1){
+                return 'moneyHeaderClass';
+            } else{
+                return 'customClass';
+            }
+        };
+
+        scope.money = function(/*$column*/) {
+
             var def = $q.defer();
 
             def.resolve([{
@@ -175,7 +184,7 @@ describe('ng-table', function() {
 
         expect(angular.element(titles[0]).hasClass('customClass')).toBeTruthy();
         expect(angular.element(titles[1]).hasClass('customClass')).toBeTruthy();
-        expect(angular.element(titles[2]).hasClass('customClass')).toBeTruthy();
+        expect(angular.element(titles[2]).hasClass('moneyHeaderClass')).toBeTruthy();
     }));