title: ng-grid - create multiple line column headings
body: <p>I am trying to get multiple line column headings working in ng-grid. I'm using AngularJS 1.2.11, ng-grid 2.0.8 and JQuery 2.1.0. here is my latest attempt. The header still displays as "Some<br>Data".</p>
  
  <pre><code>var app = angular.module('myApp', ['ngGrid']);
  
  app.controller('myCtrl', function($scope, $sce) {
  
  var head4 = 'Some&lt;br&gt;Data'
  var trustHead4 = $sce.trustAsHtml(head4);
  
  var colDefs = [{field: 'name', displayName: 'Name'},
                 {field: 'age', displayName: 'Age in Years'},
                 {field: 'datums', displayName: trustHead4, width:100},
                ];
  
  var myHeaderCellTemplate = '&lt;div class="ngHeaderSortColumn {{col.headerClass}}" ng-style="{cursor: col.cursor}" ng-class="{ ngSorted: !noSortVisible }"&gt;' +
                             '&lt;div ng-click="col.sort($event)" ng-class="\'colt\' + col.index" class="ngHeaderText" ng-bind-html="col.displayName"&gt;&lt;/div&gt;' +
                             '&lt;div class="ngSortButtonDown" ng-show="col.showSortButtonDown()"&gt;&lt;/div&gt;' +
                             '&lt;div class="ngSortButtonUp" ng-show="col.showSortButtonUp()"&gt;&lt;/div&gt;' +
                             '&lt;div class="ngSortPriority"&gt;{{col.sortPriority}}&lt;/div&gt;'+
                             '&lt;/div&gt;' +
                             '&lt;div ng-show="col.resizable" class="ngHeaderGrip" ng-click="col.gripClick($event)" ng-mousedown="col.gripOnMouseDown($event)"&gt;&lt;/div&gt;';
  
  $scope.myData = [{name: "Thomas", age: 27, datums: 'adfkjrg'},
                   {name: "Frances", age: 43, datums: 'adfkjrg'},
                   {name: "Leila", age: 27, datums: 'adfkjrg'},
                   {name: "Cute", age: 29, datums: 'adfkjrg'},
                   {name: "John", age: 34, datums: 'adfkjrg'}
                  ];
  
  $scope.myGrid = {
      data: 'myData',
      showGroupPanel: false,
      columnDefs: colDefs,
      showFooter: false,
      headerCellTemplate: myHeaderCellTemplate
  };
  });
  </code></pre>