This sample demonstrates aggregate functionality of the Tree Grid. In this sample, the aggregate value for the columns “Total Units” and “Unit Weight” is displayed in column footer and provide an option to show child summary.
Freight ID | Freight Name | Unit Weight | Total Units |
|---|---|---|---|
CX2389NK | Maersk Edibles Co. | 241 | 598 |
QW4567OP | Chang | 50 | 123 |
QW3458BH | Aniseed Syrup | 87 | 89 |
QW8967OH | Chef Antons Cajun Seasoning | 54 | 46 |
QW6549NJ | Chef Antons Gumbo Mix | 50 | 340 |
| 87 | 46 | ||
DW8954IO | Aeon fitness inc. | 296 | 1720 |
UF5647YH | Reebox CrossFit Back Bay | 73 | 600 |
UF1290LK | The Green Microgym | 90 | 569 |
UF8956KU | DeFrancos | 68 | 456 |
UF7464JK | Westside Barbell | 65 | 95 |
| 90 | 95 | ||
EJ9456KN | Sun technologies inc | 192 | 331 |
GH2367OP | Haier Group | 23 | 78 |
GH4309TH | Panda Electronics | 48 | 90 |
GH3494SD | Jiangsu Etern | 56 | 36 |
GH3213FR | Zhejiang Fuchunjiang | 65 | 127 |
| 65 | 36 |
| Show Child Summary |
The Tree Grid supports aggregates which will be displayed at the footer and every hierarchy level. The aggregate configurations can be provided by the aggregates property.
The built-in aggregates are,
SumAverageMinMaxCountTrueCountFalseCountCustom - Requires the customAggregate property to perform aggregation.Injecting Module:
Tree Grid component features are segregated into individual feature-wise modules. To use aggregate feature, we need to inject AggregateService into the @NgModule.providers section.
More information about aggregate can be found in this documentation section.