New to Kendo UI for Angular? Start a free 30-day trial
DrawerItemTemplateDirective
Updated on Oct 30, 2025
Defines a template that specifies the item content of the Drawer.
To define the template, nest an <ng-template> tag with the kendoDrawerItemTemplate directive inside the <kendo-drawer> tag.
The let-item context variable provides access to the item data.
For the Hierarchical Drawer, the kendoDrawerItemTemplate directive provides additional context fields:
- level—A number that indicates the nesting level of the current item. Use the- let-level="level"syntax to access the nesting level.
- hasChildren—A boolean that indicates whether the current item has nested items. Use the- let-hasChildren="hasChildren"syntax to access the value.
- isItemExpanded—A boolean that holds information about the expanded state of the current item, which indicates whether its children are visible or not. Use the- let-isItemExpanded="isItemExpanded"syntax to access the value of the expanded state.
html
<kendo-drawer>
  <ng-template kendoDrawerItemTemplate let-item>
    <span class="custom-item">{{ item.text }}</span>
  </ng-template>
</kendo-drawer>Selector
[kendoDrawerItemTemplate]