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

Environment

Product Version2.4.2
ProductProgress® Kendo UI for Vue Native

Description

How can I render HTML inside the Kendo UI for Vue Native Grid?

Solution

Define a custom template for the Grid column that should display rendered HTML. Pass the custom template to the selected column using the cell cell column property. Define the custom template as follows:

<template v-slot:myTemplate="{props, listeners}">
    <td :class="props.className" v-html="getNestedValue(props.field, props.dataItem)"></td>
</template>

Add apply the template to the selected column with the following definition:

{ field: 'ProductName', title: 'Product Name', cell: 'myTemplate' }
Example
View Source
Change Theme:

In this article

Not finding the help you need?