Templates

The Rating provides various templates that enable you to customize the default icon displayed in its items.

The available template directives that can be used for icon customizations are:

• kendoRatingItemTemplate—Used to render the icon for the default state of the Rating items.
• kendoRatingSelectedItemTemplate—Used to render the icon for the selected state of the Rating items.
• kendoRatingHoveredItemTemplate—Used to render the icon for the hovered state of the Rating items.

To customize the default icon of the Rating items, all 3 directives should be provided to the component.

To define the templates, nest an <ng-template> tag within the <kendo-rating> component for each of the directives. The templates also provide access to the index of the current item by using the let-index="index" syntax.

The following example demonstrates how to customize the icons of the Rating items using the available templates.

Suggested Links

• API Reference of the Rating