angular-gantt/mkdocs/plugins/corner.md

Gantt chart component for AngularJS

# Corner

Display labels for column headers in the corner

## Usage

    angular.module('myApp', ['gantt', 'gantt.corner']);
    
<!-- -->

    <div gantt>
        <gantt-corner enabled="..." headers-labels="..."></gantt-corner>
    </div>

<!-- -->

    <link rel="stylesheet" href="angular-gantt-corner.css">

## Attributes

- ### enabled

    Enable corner display.
  
    default: `true`

- ### headers-labels
 
    Associative object of headers labels. Key is the header, and value is the label.

        $scope.headersLabels = { 
          year: 'Year', 
          quarter: 'Quarter', 
          month: 'Month', 
          week: 'Week', 
          day: 'Day', 
          hour: 'Hour', 
          minute:'Minute'
        };
        
    It is also possible to specify a function to return the header label.
    
        $scope.headersLabels = function(headerName, headerUnit, columns) {
            // Capitalize the header name to build the label.
            return headerName.charAt(0).toUpperCase() + headerName.slice(1);
        }

- ### headers-labels-templates

    The template to use to display a single header label.
    
    default: `{{getLabel(header)}}`
    
    Can also be an associative object, where Key is the header, and value is the template.
    
        $scope.headersLabels = { 
          year: '<i>{{getLabel(header)}}</i>', 
          month: '<b>{{getLabel(header)}}</b>', 
        };
    
    It is also possible to specify a function to return the header label template.
    
        $scope.headersLabelsTemplates = function(headerName, headerUnit, columns) {
            if (headerName == 'year') {
                return '<i>{{getLabel(header)}}</i>';
            } else if (headerName == 'month') {
                return '<b>{{getLabel(header)}}</b>';
            }
            // Other case will default template.
        }