两列或多列如何求和并显示在第三列中

Question

将以下图片视为标记数据我希望两列数据和并在新列中生成以显示它。 怎么可能在 Kendo for Angular 4 。

Answer 1

为您的数据模型创建一个新的计算属性，该属性将返回所需属性的总和。

export class DataModel {
    a: number;
    b: number;
    get sum() {
      return this.a + this.b;
    }
}

然后，添加为其他属性添加的列。

或者，使用剑道提供的模板属性。

版本1：

columns: [{
            field: "PropA",
            title: "Prop A"
          },
          {
            field: "PropB",
            title: "Prop B"
          },
          {
            field: "Sum",
            template: "{{dataItem.PropA + dataItem.PropB}}"
          }]

第2版：

    <kendo-grid [data]="gridData">
        <kendo-grid-column field="PropA" title="PropA"></kendo-grid-column>
        <kendo-grid-column field="PropB" title="PropB"></kendo-grid-column>
        <kendo-grid-column field="Sum" title="Sum">
            <ng-template kendoGridCellTemplate let-dataItem>
                 {{dataItem.PropA + dataItem.PropB}}
            </ng-template>
        </kendo-grid-column>
    </kendo-grid>