Angular

Question

我可以直接将预先格式化的值绑定到 kendo 网格列吗？数据包含 html 标签，我希望该列以格式呈现数据，而不是将标签视为文本。我可以使用 ng-template 来实现所需的输出，但为此我需要解析整个数据，将其存储到不同的键中并使用它们在 .html 文件中进行格式化。无论如何，我可以让 kendo 在列内渲染 html 吗？

Answer 1

您可以使用 cell template 中的包装元素呈现 HTML，并将其 innerHtml 属性绑定到包含 [=21] 的数据项字段=] 你想渲染，例如：

<kendo-grid-column field="htmlField">
              <ng-template kendoGridCellTemplate let-dataItem>
                <div [innerHtml]="dataItem.htmlField"></div>
              </ng-template>
            </kendo-grid-column>

型号：

{
        "ProductID": 1,
        "ProductName": "Chai",
        "SupplierID": 1,
        "CategoryID": 1,
        "QuantityPerUnit": "10 boxes x 20 bags",
        "UnitPrice": 18,
        "UnitsInStock": 39,
        "UnitsOnOrder": 0,
        "ReorderLevel": 10,
        "Discontinued": false,
        "Category": {
            "CategoryID": 1,
            "CategoryName": "Beverages",
            "Description": "Soft drinks, coffees, teas, beers, and ales"
        },
        "FirstOrderedOn": new Date(1996, 8, 20),
        "htmlField": "<h1>RENDERED HTML</h1>"
    },

EXAMPLE

Angular - kendo-grid-column - 绑定html数据

Angular - kendo-grid-column - Bind html data

kendo-ui-angular2