Forums Ignite UI for Angular
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Walter Zielenski
40
summary formatting
posted

I am having trouble formatting summaries to match the numeric formatting that I have defined for a numeric column.

I have a grid (shown above) with a column "Hours", with a dataType of number, 

  [dataType]="number" 

and it has pipeArgs to show 1 decimal place

  [pipeArgs]="pipeArgs1"

where

  pipeArgs1: IFieldPipeArgs = { digitsInfo: "1.1-1" }

I have a summary defined for that column
  [summaries]="SumSummary"
And I have a formatter defined for that summary
  [summaryFormatter]="number1SummaryFormat"
How do I format summary Hours ##.0, same as cells?
Here is the code for SumSummary
class SumSummary {
  public operate(data?: any[], allData = [], fieldName = ''): IgxSummaryResult[] {
      const result = [];
      data = data || []
      let SUM = IgxNumberSummaryOperand.sum(data);
      result.push({
          key: 'SUM',
          label: '',
          summaryResult: SUM,
          defaultFormatting: true
      });
      return result;
  }
}
Here is the code for number1SummaryFormat
public number1SummaryFormat(summary: IgxSummaryResult, summaryOperand: IgxSummaryOperand): any {
  const result = summary.summaryResult;
  if (summaryOperand instanceof IgxNumberSummaryOperand && summary.key !== 'count'
      && result !== null && result !== undefined) {
      const pipe = new DecimalPipe('en-US');
      return pipe.transform(result, 'number: 1.1-1') || '';
  }
  return result;
The column attributes appear to be correctly assigned, but I am not getting the expected result
Thanks in advance.
  • 500
    Verified Answer
    Offline posted

    Hello,

    Thank you for reaching out regarding the numeric formatting of summaries in your grid.

    I have been looking into your question and based on your request, it appears you want the summaries in your "Hours" column to match the numeric formatting defined for the cells, specifically displaying one decimal place. The good news is that if you have formatted the cells, you do not need to use the summaryFormatter property or create a special formatter for the summaries. The summaries will automatically inherit the cell formatting.

    To illustrate this, I have prepared a sample that demonstrates how the summaries will automatically be formatted to match the cells when the cells are formatted.

    Here is the sample for your reference: StackBlitz Sample.

    In this sample, the "Price" column is formatted to display one decimal place using pipeArgs1, and the summaries are displayed with the same formatting without the need for a summaryFormatter.

    The described scenario could be observed here:

     

    If you continue to experience the same describe behavior or have any further questions, please do not hesitate to reach out.

    Regards,

    Georgi Anastasov

    Entry Level Software Developer

    Infragistics

  • 40
    Offline posted

    For some reason, the screenshots I pasted into the editor for the question above did not make it into the forum.

    Attempting to paste them again here in a reply

    Screenshot

    Console showing Column properties