Этот код прекрасно работает и показывает заголовок из нескольких столбцов :
<ng-template #recursiveGroup ngFor [ngForOf]="headers" let-header>
<kendo-grid-column-group [title]="header.title">
<ng-template *ngIf="header.columns" ngFor [ngForOf]="header.columns" let-column>
<!--<ng-template
[ngTemplateOutlet]="reusable"
[ngTemplateOutletContext]="{column:column}">
</ng-template>-->
<kendo-grid-column
field="{{column.field}}"
title="{{column.title}}"
>
</kendo-grid-column>
</ng-template>
</kendo-grid-column-group>
</ng-template>
![enter image description here](https://i.stack.imgur.com/5m2GD.png)
Если я пишу с использованием следующего способа:
<ng-template #recursiveGroup ngFor [ngForOf]="headers" let-header>
<kendo-grid-column-group [title]="header.title">
<ng-template *ngIf="header.columns" ngFor [ngForOf]="header.columns" let-column>
<ng-template
[ngTemplateOutlet]="reusable"
[ngTemplateOutletContext]="{column:column}">
</ng-template>
<!--
<kendo-grid-column
field="{{column.field}}"
title="{{column.title}}"
>
</kendo-grid-column>
-->
</ng-template>
</kendo-grid-column-group>
</ng-template>
<ng-template #reusable let-column="column" let-ch="ch" let-headerTitle="headerTitle">
<kendo-grid-column
field="{{column.field}}"
title="{{column.title}}"
>
</kendo-grid-column>
</ng-template>
, тогда заголовок отсутствует:
![enter image description here](https://i.stack.imgur.com/Qz9nX.png)
Когда я использую ngTemplateOutlet
, заголовки с несколькими столбцами отсутствуют.
Можно ли использовать ngTemplateOutlet
и <kendo-grid-column-group/>
вместе?