Question

TL; DR

从分组行中删除列名时，如何保持内容文本进入下一页。

问题已解决

我正在使用Devextreme datagrid显示数据（具有分页），并且我注意到，当按列对数据进行分组时，组名将始终显示为：

groupingColumnName: columnValue

例如，如果我有一个包含ID，Name的表并说Age并决定按年龄分组，那么我的表将看起来像这样：

| ID    | Name   |
|----------------|
|Age: 21       v | <---- grouping row (expanded)
|----------------|
| 1     | Elise  | <---- grouping's content
| 5     | Mary   |
|----------------|
|Age: 24       v |
|----------------|
| 2     | Joseph |
|----------------|
|Age: 17       > | <---- grouping row (collapsed)
|----------------|
|----------------|
|Age: 30        v|
|----------------|
| ...            |

我尝试使用groupCellTemplate并设法仅获取该值，但是现在如果行被扩展但是内容在下一页上，那么我没有得到其旁边的(Continues on the next page)文本，通常在默认情况下有效。

在删除用于分组的列的名称时，如何保留转到下一页的内容的文本？

Answer 1

我意识到，一旦使用了groupCellTemplate绑定，就必须手动添加通常有条件显示的任何文本，否则网格将始终按原样显示您的模板。

因此，您需要在需要时自己添加(Continues on the next page)或(Continued from previous page)文本。

我这样做的方法是使用groupContinuedMessage和groupContinuesMessage属性。这些通常是未定义的，因此，如果不是，则可以将其附加到分组的行文本中：

模板

<dxi-column 
  [groupCellTemplate]="formatGroupCell" 
  caption="Age"
  dataField="Age" 
  [groupIndex]="0">
</dxi-column>

.ts

formatGroupCell(elem, data) {
    let formattedValue = data.displayValue;
    formattedValue += data.groupContinuedMessage ? ` (${data.groupContinuedMessage}) ` : ''
    formattedValue += data.groupContinuesMessage ? ` (${data.groupContinuesMessage}) ` : ''
    elem.append(formattedValue);  
  }

或全部包含在模板中：

<dxi-column 
  [groupCellTemplate]="groupCellTemplate" 
  caption="Age"
  dataField="Age" 
  [groupIndex]="0">
</dxi-column>
<div *dxTemplate="let data of 'groupCellTemplate'">
   {{data.displayValue}}
   {{data.groupContinuesMessage ? ' ('+data.groupContinuesMessage+')' : ''}} 
   {{data.groupContinuedMessage ? ' ('+data.groupContinuedMessage+')': ''}}
</div>

现在，我不必看到用于分组的列的名称，而且我仍然可以使用分页并知道何时内容继续出现在下一页。

通过分页从Devextreme组列中删除分组名称

TL; DR

问题已解决

1 个答案:

模板

.ts