I have been utilizing primeng datatable in a recent project and am currently facing an issue with calculating the sum in the footer of a row grouping DataTable. The summation needs to occur while data is being edited and new data is being entered.
Below is the function that calculates the sum:
sumNum1: number;
calculateGroupTotal1(sectionId: number) {
this.sumNum1 = this.model.Register10Data.map(c => c.SectionId === 1 ? c.Num1 : 0)
.reduce((sum, current) => +sum + current);
console.log(this.sumNum1);
return this.sumNum1;
}
The SectionId represents the value by which the data is grouped.
In the footer, I call this function using the first example provided on the following link - http://www.primefaces.org/primeng/#/datatable/rowgroup
<template pTemplate="rowgroupfooter" let-rowData>
<td style="text-align:left">Sum</td>
<td style="text-align:center">X</td>
<td style="text-align:center">X</td>
<td>{{calculateGroupTotal1(rowData['SectionId'])}}</td>
<td></td>
<td></td>
<td></td>
</template>
I am encountering an issue where the summary field displays a concatenation of strings instead of the actual amount. Have you come across a similar problem? While the task seems straightforward, I am unsure about how to effectively utilize this control.