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.