显示表格行中列的下拉列表答案

【问题标题】：Showing Drop down for column in a row of table显示表格行中列的下拉列表
【发布时间】：2019-04-17 06:38:53
【问题描述】：

我使用 DevExtreme 模块创建了一张表，并找到以下代码

<div id="data-grid">
  <div id="data-grid-table">
    <dx-data-grid id="gridContainer" keyExpr="emailId"  [dataSource]="userAccessList" [allowColumnReordering]="true" (onRowUpdated)="onRowUpdated($event)" (onRowRemoved)="onRowRemoved($event)" [showRowLines]="true" [showBorders]="true">
      <dxo-editing mode="row" refreshMode="repaint" [allowUpdating]="true" [allowDeleting]="true" [useIcons]="true"></dxo-editing>
      <dxi-column dataField="emailId" alignment="center" [allowEditing]="false" ></dxi-column>
      <dxi-column dataField="name" alignment="center" caption="name">
      </dxi-column>
      <dxi-column dataField="Designation" alignment="center" caption="Designation" [width]="100">
      </dxi-column>
    </dx-data-grid>
  </div>
</div>

上面显示正常，但是当我点击编辑图标时，对于名称字段它显示输入字段但我需要下拉列表。

请有人帮我解决这个问题？

提前致谢。

【问题讨论】：

标签： javascript angular devextreme-angular

【解决方案1】：

使用<dxo-lookup> 和名称列表作为dataSource：

<dxi-column dataField="name" alignment="center" caption="name">
    <dxo-lookup [dataSource]="listOfNames"></dxo-lookup>
</dxi-column>

注意：如果您的名字是一个对象而不是字符串（例如listOfNames = [ {firstname: '', lastname: ''}, ... ]），您可以显示和使用对象的特定属性像这样：

<dxi-column dataField="name" alignment="center" caption="name">
    /**Uses the firstname as the value selected and as the value displayed in the dropdown list*/
    <dxo-lookup [dataSource]="listOfNames" valueExpr="firstname" displayExpr="firstname"></dxo-lookup>
</dxi-column>

【讨论】：