Kendo-Angular2：如何在具有自动生成列的 kendo-grid 中启用仅复选框选择模式

Question

我正在尝试显示带有自动生成列的 kendo-grid 并启用仅复选框选择模式。

下面创建了一个 kendo-grid 和自动生成的列并且工作正常，(plunkr)

<kendo-grid [data]="gridData" [selectable]="true">
</kendo-grid>

但是，当我尝试添加复选框选择列时，只显示复选框选择列。 (plunkr)

<kendo-grid [data]="gridData" [selectable]="true">
    <kendo-grid-checkbox-column showSelectAll="true"><kendo-grid-checkbox-column>
</kendo-grid>

指定列时有效，(plunkr)

<!-- works -->
<kendo-grid [data]="gridData" [selectable]="true">
      <kendo-grid-checkbox-column showSelectAll='true'></kendo-grid-checkbox-column>
      <kendo-grid-column field="Id" title="ID"></kendo-grid-column>
      <kendo-grid-column field="CompanyName" title="Company Name"></kendo-grid-column>
</kendo-grid>

如果事先不知道列，我怎样才能让它工作？

Answer 1

假设对象数组中的对象具有相同的属性，可以将 Object.keys() 应用于数组中的第一个对象以获得属性名称，然后将其传递给 field 属性的 kendoGridColumn 个组件。

像这样

<kendo-grid [data]="gridData" [selectable]="{checkboxOnly: true}">
  <ng-container *ngIf="gridData?.length > 0">
    <kendo-grid-checkbox-column showSelectAll="true">
    </kendo-grid-checkbox-column>
      <ng-container *ngFor="let key of Object.keys(gridData[0])">
        <kendo-grid-column [field]="key" [title]="key">
        </kendo-grid-column>
      </ng-container>
  </ng-container>
</kendo-grid>

Kendo-Angular2：如何在具有自动生成列的 kendo-grid 中启用仅复选框选择模式

Kendo-Angular2: How to enable checkbox only selection mode in kendo-grid with auto-generated columns

kendo-grid

kendo-ui-angular2

angular

Stackblitz