One of the best JavasSript datagrid SlickGrid, which was originally developed by @mleibman, is now available to Angular. SlickGrid beats most other datagrids in terms of features, customizability and performance (it can easily deal with even a million row). Angular-Slickgrid is a wrapper on top of SlickGrid and it requires Slickgrid-Universal dependency, originally we used the 6pac/SlickGrid
fork but that was dropped in >=7.0, so we no longer need external SlickGrid dependencies anymore apart from Slickgrid-Universal since v7.0. SlickGrid was also recently refactored to be browser native (no more jQuery).
📕 Documentation website powered by GitBook.
For common issues, see the Troubleshooting Section below
A good starting point is the Docs - Quick Start and/or simply clone the Angular-Slickgrid Demos repository. Please review all documentation and closed issues before opening any new issue, also consider asking installation and/or general questions on Stack Overflow unless you think there's a bug with the library.
npm install angular-slickgrid
Angular-Slickgrid
works with all Bootstrap
versions, you can see a demo of each one below. It also with any other framework like Material or Bulma and there are also extra styling themes for not just Bootstrap but also Material & Salesforce which are also available. You can also use different SVG icons, you may want to look at the Docs - SVG Icons
- Bootstrap 5 demo / examples repo
- Bootstrap 4 demo / examples repo
Bootstrap 5 demo with Single Locale
/ examples repo
Bootstrap 5 with single Locale - Code Sample with single Locale (without ngx-translate
)
For a complete set of working demos (over 30 examples), we strongly suggest you to clone the Angular-Slickgrid Demos repository (instructions are provided in the demo repo). The repo provides multiple demos and they are updated every time a new version is released, so it is updated frequently and is also used as the GitHub live demo page for both the Bootstrap 5 demo and Bootstrap 4 demo.
git clone https://github.com/ghiscoding/angular-slickgrid-demos
cd bootstrap4-demo-with-translate # or any of the 4 demos
npm install
npm start
You like to use Angular-Slickgrid? Be sure to upvote ⭐ and maybe support me with caffeine ☕ and feel free to contribute. 👷👷♀️
If you wish to contribute then make sure to follow the steps shown in the CONTRIBUTING guide.
Check out the Releases section for all latest News & Releases.
Note please be aware that only the latest version of Angular-Slickgrid is supported and will receive bug fixes. The reason older versions are not supported is simply because it's already a lot of work to maintain for a single developer.
Angular-Slickgrid | Angular version | Migration Guide | Notes |
---|---|---|---|
7.x | >=17.0 | Migration 7.x | merge SlickGrid into Slickgrid-Universal, requires Slickgrid-Universal 4.x version |
6.x | >=16.0 | Migration 6.x | removal of jQuery (now uses browser native code), requires Slickgrid-Universal 3.x version |
5.x | >=14.0 | Migration 5.x | removal of jQueryUI, requires Slickgrid-Universal 2.x version |
4.x | >=13.0 | Migration 4.x | for Ivy build only, requires Slickgrid-Universal 1.x version |
3.x | >=12.0 | Migration 3.x | the lib now uses Slickgrid-Universal monorepo v0.19.2. Also, IE11 is EOL and no longer supported. |
2.x | 7-11.x | Migration 2.x | support multiple grids on same page |
1.x | 4-6.x |
Note For a full compatibility table of Angular-Slickgrid with Slickgrid-Universal, please take a look at the Versions Compatibility Table - Wiki.
For Angular 12+ see the instructions below - Angular 12 with WebPack 5 - polyfill issue.
Angular-Slickgrid uses ngx-translate
library to support Locales, it is also required even when using a single Locale. The reason is because, we use @Optional() TranslateService
in the lib and for that to work, it requires ngx-translate
to installed. Once you run the build and if you are using a single Locale then the tree shaking process should remove these optional dependencies. See their version compatibility table below for more info
Angular Version | @ngx-translate/core |
---|---|
16+ | 15.x |
13+ (Ivy only) | 14.x |
10-13 | 13.x |
8-9 | 12.x |
7 | 11.x |
Slickgrid-Universal has 100% Unit Test Coverage and all Slickgrid-React Examples are tested with Cypress as E2E tests.