Kendo-Grid Angular的頁腳

Question

在尋找劍道網格角度的頁腳總和時需要幫助。

<kendo-grid [data]="gridData">
    <ng-template ngFor [ngForOf]="columns" let-column>
      <kendo-grid-column field="{{column}}">
          <ng-template kendoGridFooterTemplate>
             {{aggregate[column.value].sum}}
          </ng-template>
      </kendo-grid-column>
    </ng-template> 

我期望一個帶有列的網格的輸出以及頁腳中每列的相應總和。

輸出僅顯示不帶頁腳的網格。

Answer 1

StackBlitz

模板

 <kendo-grid
            [data]="gridData"
        >
        <kendo-grid-column field="ProductID" title="Product ID" width="120">

        </kendo-grid-column>

        <kendo-grid-column field="UnitPrice" title="Unit Price" width="230">

            <ng-template
                kendoGridFooterTemplate
                    let-column="column">Total {{column.title}}: {{total["UnitPrice"].sum}}</ng-template>
        </kendo-grid-column>

        </kendo-grid>

appcomponent.ts

export class AppComponent {
    public aggregates: any[] = [{field: 'UnitPrice', aggregate: 'sum'}];


    public data = [{
        'ProductID': 1,
        'ProductName': 'Chai',
        'UnitPrice': 18.0000
    }, {
        'ProductID': 2,
        'ProductName': 'Chang',
        'UnitPrice': 19.0000
    }, {
        'ProductID': 3,
        'ProductName': 'Aniseed Syrup',
        'UnitPrice': 10.0000
    }, {
        'ProductID': 4,
        'ProductName': "Chef Anton\'s Cajun Seasoning",
        'UnitPrice': 22.0000
    }, {
        'ProductID': 5,
        'ProductName': "Chef Anton\'s Gumbo Mix",
        'UnitPrice': 21.3500
    }];

    public gridData: any = this.data;
    public total: any = aggregateBy(this.data, this.aggregates);

}