首页 > 解决方案 > 如何在一列中有多个字段属性-Syncfusion和Angular

问题描述

我正在使用 Angular 和 Synfusion。我想知道如何在一列中有多个属性。Synfusion 的文档并没有真正的帮助..

  <ej-grid id="Grid" #grid [dataSource]="datasource.infos" allowPaging="true" allowFiltering="true" selectionType="single" allowSelection="true"
    [selectionSettings]="selectionMode" (rowSelected)="rowSelected()" (cellSelected)="onCellSelected($event)">
      <e-columns>
          <e-column field="forename"  headerText="Fullname"></e-column>
      </e-columns>
  </ej-grid>

<e-column field="forname" headerText <e-column field="forename" headerText="Patient"></e-column>此字段中,我还需要姓氏,但我不知道如何使用 Syncfusion。在“forname surname”列中应显示中间有空格

有人有想法吗?

标签: angularsyncfusion

解决方案


查询:“<strong>在“forname surname”列中应显示中间有空格”</p>

根据您的查询,我们了解到您需要在单列中显示两列值。我们使用ejGrid 的列模板功能实现了您的要求。请参考以下代码示例

<ej-grid #grid [dataSource]="gridData" allowPaging="true"> <e-columns> <e-column field="EmployeeID" [isPrimaryKey]="true" headerText="ID" textAlign="right" width="90"></e-column> <e-column field="TitleOfCourtesy" headerText="TitleOfCourtesy" textAlign="right" width="90"></e-column> <e-column headerText="FirstName - LastName" width="150"> <ng-template e-template let-data> <div *ngIf="data.FirstName"> {{data.FirstName}} - {{data.LastName}} </div> </ng-template> </e-column> <e-column field="Title" headerText="Role" textAlign="right" width="80"></e-column> <e-column field="Address" headerText="ShipCity" editType="dropdownedit" width="90"></e-column> <e-column field="PostalCode" headerText="ShipPostalCode" width="90"></e-column> </e-columns> </ej-grid>

请参阅下面的屏幕截图以获取输出

在此处输入图像描述

请参阅我们的帮助文档以供参考

https://help.syncfusion.com/angular/grid/columns#column-template

如果您有任何疑问,请告诉我们。


推荐阅读