如何在 angular 的 kendoUI 网格中实现下拉列表。找不到任何文档

Question

类似于 this。但是这个例子是针对 jquery 的 kendoUI。我需要 angular.

的 kendoUI 文档

Answer 1

我在我的申请中这样做。这是它的一个简单版本：

HTML 模板

<kendo-grid [data]="someData" [height]="750">
  <kendo-grid-column field="LaborType" title="Task" width="120">
    <ng-template kendoGridCellTemplate let-dataItem>
      {{ GetLaborTypeDesc(dataItem.LaborType)?.LaborTypeDesc }}
    </ng-template>
    <ng-template kendoGridEditTemplate>
      <kendo-dropdownlist [defaultItem]="{LaborTypeID: null, LaborTypeDesc: 'Select a task...'}" [data]="LaborTypes"
        textField="LaborTypeDesc" valueField="LaborTypeID" [valuePrimitive]="true">
      </kendo-dropdownlist>
    </ng-template>
  </kendo-grid-column>
</kendo-grid>

打字稿

  LaborTypes: Array<{ LaborTypeDesc: string, LaborTypeID: number }> = [];

  public GetLaborTypeDesc(id: number): any {
    return this.LaborTypes.find(x => x.LaborTypeID === id);
  }

我的网格中有添加、编辑和删除命令，其中涉及此处未显示的表单。我也在 ngOnInit 函数中填充了 LaborTypes 对象数组，因此用户可以在下拉列表中进行选择。