Templating

Row Templates

---

Default Row Template:

// passed in as a string
<div>
    <div ng-repeat="col in columns" style="width: {{col.width}}px" class="ngCell {{columnClass($index)}} {{col.cellClass}}" ng-cell></div>
</div>

Example:

    $scope.gridOptions = {
        data: self.myData,
        rowTemplate: '<div><div ng-repeat="col in columns" style="width: {{col.width}}px" class="ngCell {{columnClass($index)}} {{col.cellClass}}" ng-cell></div></div>'
 };

You can also define cells explicitly instead of using ng-repeat bu updating the rowTemplate

Cell Templates

---

Default Cell Template:

<div>{{row.entity[col.field]}}</div>

    $scope.gridOptions = {
        data: self.myData,
        columnDefs: [{ field: 'firstName', displayName: 'First Name', width: 90, cellTemplate: '<div>{{row.entity[col.field]}}</div>' },
                     { field: 'lastName', displayName: 'Last Name', width: 80 },
                     { field: 'age', cellClass: 'ageCell', headerClass: 'ageHeader' ]
 };