如何为 Angular 的 Kendo 网格创建动态单元格
How to create dynamic cells for Kendo grid for Angular
我有一个 Kendo 网格,其中我需要根据数据在单个列中使用不同的输入控件。我有三种情况:
- 如果值为
true
,复选框应该出现在编辑中。
- 如果值是
string
或 number
,文本框应该进行编辑
- 如果值为“更多”,超链接应在编辑时出现。
请看上面的截图。
在您定义列的模板中,您可以为单元格使用自定义模板。在这里你可以写一些条件来决定渲染什么:
<kendo-grid-column field="example" title="Example" width="100">
<ng-template kendoGridCellTemplate let-dataItem>
<!-- You can use ngIf and/or ngSwitch here. -->
</ng-template>
</kendo-grid-column>
API: https://www.telerik.com/kendo-angular-ui/components/grid/api/CellTemplateDirective/
我有一个 Kendo 网格,其中我需要根据数据在单个列中使用不同的输入控件。我有三种情况:
- 如果值为
true
,复选框应该出现在编辑中。 - 如果值是
string
或number
,文本框应该进行编辑 - 如果值为“更多”,超链接应在编辑时出现。
请看上面的截图。
在您定义列的模板中,您可以为单元格使用自定义模板。在这里你可以写一些条件来决定渲染什么:
<kendo-grid-column field="example" title="Example" width="100">
<ng-template kendoGridCellTemplate let-dataItem>
<!-- You can use ngIf and/or ngSwitch here. -->
</ng-template>
</kendo-grid-column>
API: https://www.telerik.com/kendo-angular-ui/components/grid/api/CellTemplateDirective/