7 Best Angular Grid Libraries
by Dhiren Gala Updated: Feb 3, 2023
Guide Kit
Here are the best Angular grid libraries for your web application. These libraries provide various functionalities that can be easily integrated with Angular-based development. You can use this collection of tools to create and manage grid-based layouts in multiple applications.
A grid layout is a series of rows and columns to arrange and align elements on a web page. Angular grid libraries provide a range of features, including:
- Responsive design: Many Angular grid libraries allow developers to create responsive designs that automatically adjust to different screen sizes.
- Column and row management: Angular grid libraries typically provide ways to define the number of columns and rows in a grid and to specify the width and height of individual cells.
- Data binding: Angular grid libraries often support data binding so that data from a model can be automatically displayed in the grid.
- Sorting and filtering: Angular grid libraries often include features for sorting and filtering data in the grid, making it easier to manage large datasets.
- Customization: Many Angular grid libraries allow developers to customize the appearance and behavior of the grid, such as setting colors, fonts, and styles.
We have handpicked top and trending Angular grid libraries based on popularity, licensing, and unique features to build beautiful and functional grid-based layouts in your applications:
Ag-grid:
- Used in User Interface, Grid, Angular, and React applications.
- A feature-rich data grid with both free and enterprise versions.
- Provides a wide range of features, including sorting, filtering, pagination, and grouping.
ag-gridby ag-grid
The best JavaScript Data Table for building Enterprise Applications. Supports React / Angular / Vue / Plain JavaScript.
ag-gridby ag-grid
TypeScript
9806
Version:v29.2.0
License: Others (Non-SPDX)
PrimeNG:
- Used in User Interface, Chart, Angular, Bootstrap, and jQuery applications.
- Provides a comprehensive set of UI components, including a data grid.
- Offers advanced features such as lazy loading, virtual scrolling, and row grouping.
ngx-datatable:
- Used for highly customizable and performance-optimized data table functionality.
- Is an Angular component for presenting large and complex data.
- Supports features like pagination, sorting, and filtering,
- Offers advanced features like virtual scrolling and column resizing.
ngx-datatableby swimlane
✨ A feature-rich yet lightweight data-table crafted for Angular
ngx-datatableby swimlane
TypeScript
4546
Version:4.2.0
License: Permissive (MIT)
Material Table:
- Used for its simple and powerful Datatable functionality.
- Is a data grid library for Angular.
- Built on top of the Material Design components.
- Provides a wide range of features, including pagination, sorting, filtering, and row selection.
material-tableby mbrn
Datatable for React based on material-ui's table with additional features
material-tableby mbrn
JavaScript
3419
Version:v1.69.0
License: Permissive (MIT)
ng2-smart-table:
- Used for its highly customizable data grid capabilities.
- Provides a range of features, including pagination, sorting, and filtering.
- Supports editing, adding, and deleting rows.
ng2-smart-tableby akveo
Angular Smart Data Table component
ng2-smart-tableby akveo
TypeScript
1615
Version:v1.7.2
License: Permissive (MIT)
Angular Material Data Table:
- Used for visualizing and manipulating large data sets.
- Is a data grid component built on the Angular Material library.
- Provides a range of features, including sorting, filtering, and pagination.
- Advanced features like virtual scrolling and column resizing.
md-data-tableby daniel-nagy
Material Design Data Table for Angular Material
md-data-tableby daniel-nagy
JavaScript
1927
Version:Current
License: Permissive (MIT)
Angular-tree-grid:
- Used in User Interface, Grid, Angular applications, etc.
- Provides hierarchical data representation.
- Supports features like sorting, filtering, and pagination,
- Advanced features like lazy loading and tree expansion.
angular-tree-gridby debabratapatra
Angular 10 Tree Grid
angular-tree-gridby debabratapatra
TypeScript
24
Version:Current
License: Permissive (MIT)