How to Customize the Grouping Bar in Angular Pivot Table

Arun Raj
2 min readFeb 15, 2024

Learn how easily you can add, remove, filter, and sort members in the Syncfusion Angular Pivot Table Component. In this video, I will show you how to add, remove, filter, and sort members using the grouping bar UI in the Syncfusion Angular Pivot Table component. You will see, how to rearrange the fields between axes and modify the aggregation type. You will also see, how to enable the fields panel and customize the grouping bars.

The Syncfusion Pivot Table is a powerful tool for organizing, summarizing, and visualizing business data sets in a cross-tabular format. A pivot table is a data processing tool for analyzing and summarizing data in a spreadsheet-like format. It allows users to arrange and rearrange data, perform calculations, and display results in a tabular format. Syncfusion provides a comprehensive Angular Pivot Table component that enables developers to integrate the powerful pivot table functionality into their Angular applications.

This component allows users to drag-and-drop fields to build pivot tables dynamically. It supports various aggregation options to perform calculations on data and grouping of data and displaying subtotals for better organization. Users can filter and sort data based on specific criteria. It provides the ability to drill down into detailed data and drill up to view summary data. Supports various data sources, including JSON, remote, and data from different services. You can easily include it using Angular CLI or other Angular module-loading systems in your Angular projects.

Tutorial video:

Download the example from GitHub: