title: ag-grid custom header with html
body: <p>I am trying to use ag-grid to display the data.
  I want to have HTML tags inside the Header column, but that doesn't seems to be working. I have previous knowledge working with ui-grid but this ag-grid is new to me, so not sure where I am missing.
  Here is what I have tried till now:</p>
  
  <pre><code>var columnDefs = [
                     {headerName: "Workload", field: "workload"},
                     {headerName: "units", "field": "units"}
                   ];
  </code></pre>
  
  <p>Grid Options:</p>
  
  <pre><code>$scope.gridOptionsObject = {
                              columnDefs: columnDefs,
                              rowData: $scope.rowData,
                              headerCellRenderer: (params) =&gt;
                                  {return headerCellRendererFunc(params)}
                          };
  </code></pre>
  
  <p>// Header cell renderer function:</p>
  
  <pre><code>        var headerCellRendererFunc = function(params) {
              var headerColDef = params.colDef;
              headerColDef.name =  headerColDef.headerName;
              headerColDef.isMetadata = false;
              return '&lt;h1 column="headerColDef"&gt;&lt;/h1&gt;';
          }
  </code></pre>
  
  <p>Can anyone help me out here.</p>