New to Kendo UI for Angular? Start a free 30-day trial

Rendering Grid Items in a Custom ListView


ProductProgress® Kendo UI Grid


How can I render the data items to which the Angular Grid by Kendo UI is bound in a custom, list-view fashion?


The suggested implementation demonstrates how to apply a custom approach for rendering the Grid items in a list-view fashion. For more information on using the individual Kendo UI for Angular ListView component which provides templating, paging and other features, refer to the official ListView documentation.

Use specific templates for a collection of data items. This data-item collection might have to be in the form of a list-view instead of a regular table while, at the same time, the data operation functionality of the Grid is maintained. To override the built-in styling of the Kendo UI Grid for Angular and customize the layout as desired, use the cell templates.

The following example demonstrates how to render the data items to which the Grid is bound in a list view fashion.

View Source
Change Theme:

In this article

Not finding the help you need?