New to Kendo UI for Angular? Start a free 30-day trial
CellTemplateDirective
Represents the column cell template of the TreeList (more information and example).
Helps to customize the content of the cells. To define the cell template, nest an <ng-template>
tag
with the kendoTreeListCellTemplate
directive inside a <kendo-treelist-column>
tag.
The template context is set to the current data item and the following additional fields are passed:
columnIndex
—The current column index. Use it as an alias for a template variable by utilizing thelet-columnIndex="columnIndex"
syntax.column
—The current column instance. Use it as an alias for a template variable by utilizing thelet-column="column"
syntax.dataItem
—The current data item. Represents the default context that will be assigned to any template variable which utilizes thelet-x
syntax—for example,let-dataItem
.cellContext
—An object used to pass context information to built-in directives.hasChildren
—Specifies if the item has children.isExpanded
—Specifies if the item is expanded.level
—The hierarchy level of the item.loading
—Specifies if the item children are currently loading.rowIndex
—The current row index. Use it as an alias for a template variable by utilizing thelet-rowIndex="rowIndex"
syntax.
html
<kendo-treelist ...>
<kendo-treelist-column field="ProductName">
<ng-template kendoTreeListCellTemplate let-dataItem let-rowIndex="rowIndex" let-column="column">
Data Row: {{rowIndex}}
</ng-template>
</kendo-treelist-column>
</kendo-treelist>
Selector
[kendoTreeListCellTemplate]