Rendering Grid Items in a Custom ListView

Environment

Description

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

Solution

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.