将Kendo Angular网格列模板传递给托管网格的父组件

时间:2018-08-17 23:06:31

标签: angular kendo-ui kendo-grid angular-template kendo-angular-ui

我已经在Telerik Kendo Angular UI forum上问了这个问题,如果得到答案,它将更新两个位置,但是这个问题可能是由于我有限的Angular知识而不是Kendo功能。

我的目标是让一个组件“网格用户”将列模板(kendoGridCellTemplate,kendoGridHeaderTemplate等)传递给承载该元素的父级“网格提供者”组件,以便多个网格用户可以显示同一网格无需每个都配置分页,排序等。

我的应用程序提供了搜索各种产品的能力。所有搜索结果都显示在Kendo UI的Angular网格中。每种产品在搜索结果中都有不同的字段,但网格的一般功能始终相同。我想一次定义网格,但是让不同的搜索提供者提供自己的列配置和数据。但是,到目前为止,当<ng-template kendoGridCellTemplate>等直接嵌套在<kendo-grid-column>元素下并且嵌套在<kendo-grid>元素下时,我只能提供标头,过滤器和单元格模板-都在同一个模板中。

请参见以下示例:https://stackblitz.com/edit/angular-htffqq

第一个网格已正确配置,但是单元格模板位于<kendo-grid-column><kendo-grid>的正下方。第二个网格显示默认配置,无法识别@ContentChild提供的模板,默认为无配置。

是否可以通过这种方式配置列?我尝试了许多略有不同的方法,但是似乎没有任何作用,所以我开始认为这根本不可能。

2 个答案:

答案 0 :(得分:1)

我认为网格无法选择以此方式提供的模板。至少我无法从投影内容中选择ContentChild或ContentChildren。 您可以使用我建议的方法here-在GridProvider组件中获取TemplateRef并使用列模板中的ngTemplateOutlet呈现它:

https://stackblitz.com/edit/angular-htffqq-ngmlgw?file=app/grid-provider.component.ts

答案 1 :(得分:0)

在@SiliconSoul的示例之后,首选解决方案是在这里:https://stackblitz.com/edit/angular-htffqq-p8wies