如何正式使用Grid Kendo和ngx创建自定义模板？

问题描述

我正式使用kedo网格和ngx显示数据。

有4个文件。 kedo.ts和kedo.html用于自定义模板， component.html和component.ts使用模板。 我已尝试过尽可能简化代码，但仍未定义数据。

kedo.ts

<kendo-grid 
[kendoGridBinding]="gridData"
[formlyAttributes]="field">

  <kendo-grid-column 
  *ngFor="let column of columns" 
  [field]="to.columns">
      <ng-template kendoGridHeaderTemplate let-column let-columnIndex="columnIndex">
      <span [class.special]="column.field === 'CompanyName'">  {{column.field}}({{columnIndex}})</span>
      </ng-template>
         <ng-template kendoGridCellTemplate let-dataItem let-rowIndex="rowIndex">
        <span [class.special]="column === 'CompanyName'">  {{dataItem[column]}}</span>
      </ng-template>
  </kendo-grid-column>
</kendo-grid>

kedo.ts

export class DatatableFormComponentKendo extends FieldArrayType implements OnInit { 

}

  private gridData: any[] //= sampleCustomers; if uncoment here in the grid data will be displayed. 
constructor() {
    super(); 
  }

component.ts

  private gridData: any[] = sampleCustomers;
  public columns: any[] = [{ field: 'ProductName',title: 'Name'},{ }];


  fieldsTable: FormlyFieldConfig[] = [{
    key: 'gridData',type: 'datatable-kendo',templateOptions: {
      column: [
        { field: 'actions'},{ field: 'id'},],}

component.html

<form [formGroup]="form" (ngSubmit)="onSubmitForm(data)" class="py-3">
    <formly-form [model]="modelTable" [fields]="fieldsTable" [options]="options" [form]="form">
    </formly-form>
</form>

解决方法

我正式启动了一个kendo网格和kendo树列表组件，将其发布在github上，您可以在github问题上给它一些时间和想法

https://github.com/ngx-formly/ngx-formly/issues/2371

但是我认为该组件可以解决您的问题