Передача шаблонов столбцов сетки Kendo Angular родительскому компоненту, в котором размещена сетка
Я задал этот вопрос на форуме пользовательского интерфейса Telerik Kendo Angular и обновлю оба местоположения, если я получу ответ, но эта проблема может быть связана с моими ограниченными знаниями Angular, а не с функциями Kendo.
Моя цель состоит в том, чтобы один компонент "grid-user" передавал шаблоны столбцов (kendoGridCellTemplate, kendoGridHeaderTemplate и т. Д.) Родительскому компоненту "grid-provider", в котором размещается элемент, так что несколько пользователей grid могут представлять одну и ту же сетку без каждого настроить подкачку, сортировку и т. д.
Мое приложение предоставляет возможность поиска различных видов товаров. Все результаты поиска отображаются в Kendo UI для угловой сетки. Каждый вид продукта имеет различные поля, которые отображаются в результатах поиска, но общие функциональные возможности сетки всегда одинаковы. Я хочу определить сетку один раз, но позволю различным поставщикам поиска предоставить свои собственные конфигурации столбцов и данные. Однако до сих пор я смог предоставить заголовок, фильтр и шаблоны ячеек только тогда, когда <ng-template kendoGridCellTemplate> и т. д. вложены прямо под <kendo-grid-column> элементы, которые вложены прямо под <kendo-grid> элемент - все в одном шаблоне.
Пожалуйста, посмотрите этот пример: https://stackblitz.com/edit/angular-htffqq
Первая сетка настроена правильно, но шаблоны ячеек находятся прямо под <kendo-grid-column> а также <kendo-grid>, Вторая сетка, которая показывает конфигурацию по умолчанию, не распознает шаблон, предоставленный @ContentChild и по умолчанию нет конфигурации.
Можно ли настроить столбцы таким образом? Я перепробовал много разных подходов, но ни один из них не имеет значения, поэтому я начинаю думать, что это просто невозможно.
2 ответа
Я не думаю, что сетка может выбирать шаблоны, предоставленные таким образом. По крайней мере, я не мог выбрать что-либо с ContentChild или ContentChildren из проецируемого контента. Вы можете использовать подход, который я предложил здесь - получить TemplateRef в компоненте GridProvider и отобразить его с помощью ngTemplateOutlet в шаблонах столбцов:
https://stackblitz.com/edit/angular-htffqq-ngmlgw?file=app/grid-provider.component.ts
Следуя примеру @SiliconSoul, предпочтительное решение находится здесь: https://stackblitz.com/edit/angular-htffqq-p8wies