Angular Kendo Grid如何在列组中获取rowIndex并应用于子列？

首先得明确一点：Kendo Grid的<kendo-grid-column-group>是用来定义列分组结构的，属于网格的静态配置部分，本身并不直接关联行级数据（比如rowIndex）——rowIndex是在渲染每一行单元格时才会生成的行级变量，所以所有需要用到rowIndex的逻辑都应该放在行渲染的上下文里，也就是kendoGridCellTemplate单元格模板中。

下面给你修正后的代码示例，同时说明如何获取和使用rowIndex：

步骤1：在单元格模板中获取RowIndex #

Kendo Grid的单元格模板支持内置的rowIndex变量，只需要通过let-rowIndex="rowIndex"声明就能直接使用。结合你的场景，代码可以改成这样：

<kendo-grid [data]="gridData">
  <!-- 遍历分类数组生成列分组 -->
  <kendo-grid-column-group 
    [width]="500" 
    [locked]="false" 
    *ngFor="let test of categoryArr" 
    title="{{test.categoryName}}">

    <!-- 分组内的列 -->
    <kendo-grid-column 
      [field]="test.compliantField" <!-- 这里绑定数据源的字段名，建议让test对象存储字段标识 -->
      title="COMPLIant">
      
      <!-- 单元格模板：声明rowIndex变量 -->
      <ng-template 
        kendoGridCellTemplate 
        let-dataItem="dataItem" <!-- 当前行的数据源对象 -->
        let-rowIndex="rowIndex" <!-- 获取当前行索引 -->
        let-columnIndex="columnIndex">
        
        <!-- 显示当前行对应分类的compliant值 -->
        {{ dataItem[test.compliantField] }}
        
        <!-- 使用rowIndex实现你的需求，比如访问额外数组、计算等 -->
        <div>当前行索引：{{ rowIndex }}</div>
        <!-- 示例：如果有和行对应的额外数据数组，用rowIndex取值 -->
        <!-- {{ extraRowData[rowIndex] }} -->
      </ng-template>
    </kendo-grid-column>
  </kendo-grid-column-group>
</kendo-grid>

步骤2：关于Column Group中使用RowIndex的说明 #

如果你的需求是想在<kendo-grid-column-group>的标题或属性中使用rowIndex，这其实不符合Kendo Grid的设计逻辑——因为列分组的标题是全局的列头，不是每行动态变化的。如果需要实现每行的分组区域有动态内容，应该把这部分逻辑放在单元格模板里，通过单元格合并或者自定义样式来模拟分组效果。

关键注意点 #

• 不要直接写field="test.compliant"，要用属性绑定[field]="test.compliantField"，这样才能正确关联到循环变量中的字段名。
• dataItem是当前行的数据源对象，结合test.compliantField可以精准拿到当前行对应分类的compliant值。
• rowIndex从0开始计数，如果你需要从1开始显示，可以直接做{{ rowIndex + 1 }}。

内容的提问来源于stack exchange，提问作者SDas