angular-slickgrid 6.3.1 → 6.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +8 -6
- package/app/modules/angular-slickgrid/services/angularUtil.service.d.ts +1 -0
- package/esm2022/app/modules/angular-slickgrid/components/angular-slickgrid.component.mjs +4 -4
- package/esm2022/app/modules/angular-slickgrid/global-grid-options.mjs +2 -2
- package/esm2022/app/modules/angular-slickgrid/modules/angular-slickgrid.module.mjs +5 -5
- package/esm2022/app/modules/angular-slickgrid/services/angularUtil.service.mjs +24 -5
- package/esm2022/app/modules/angular-slickgrid/services/container.service.mjs +4 -4
- package/esm2022/app/modules/angular-slickgrid/services/translater.service.mjs +4 -4
- package/fesm2022/angular-slickgrid.mjs +37 -18
- package/fesm2022/angular-slickgrid.mjs.map +1 -1
- package/package.json +9 -9
package/README.md
CHANGED
|
@@ -28,8 +28,10 @@ npm install angular-slickgrid
|
|
|
28
28
|
- [Bootstrap 5 demo](https://ghiscoding.github.io/Angular-Slickgrid) / [examples repo](https://github.com/ghiscoding/angular-slickgrid-demos/tree/master/bootstrap5-demo-with-translate)
|
|
29
29
|
- [Bootstrap 4 demo](https://ghiscoding.github.io/angular-slickgrid-demos) / [examples repo](https://github.com/ghiscoding/angular-slickgrid-demos/tree/master/bootstrap4-demo-with-translate)
|
|
30
30
|
|
|
31
|
+
[Bootstrap 5 with single Locale](https://github.com/ghiscoding/angular-slickgrid-demos/tree/master/bootstrap5-demo-with-locales) - Code Sample with single Locale (without `ngx-translate`)
|
|
32
|
+
|
|
31
33
|
#### Working Demo
|
|
32
|
-
For a complete set of working demos (over 30 examples), we strongly suggest you to clone the [Angular-Slickgrid Demos](https://github.com/ghiscoding/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
|
|
34
|
+
For a complete set of working demos (over 30 examples), we strongly suggest you to clone the [Angular-Slickgrid Demos](https://github.com/ghiscoding/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](https://ghiscoding.github.io/Angular-Slickgrid) and [Bootstrap 4 demo](https://ghiscoding.github.io/angular-slickgrid-demos).
|
|
33
35
|
|
|
34
36
|
```sh
|
|
35
37
|
git clone https://github.com/ghiscoding/angular-slickgrid-demos
|
|
@@ -84,13 +86,13 @@ Angular-Slickgrid uses `ngx-translate` library to support Locales, it is also re
|
|
|
84
86
|
| 7 | 11.x |
|
|
85
87
|
|
|
86
88
|
### Fully Tested with [Jest](https://jestjs.io/) (Unit Tests) - [Cypress](https://www.cypress.io/) (E2E Tests)
|
|
87
|
-
Angular-Slickgrid and Slickgrid-Universal both have **100%** Unit Test Coverage,
|
|
89
|
+
Angular-Slickgrid and Slickgrid-Universal both have **100%** Unit Test Coverage, that includes over +4,000 unit tests using [Jest](https://jestjs.io/). On the UI side, all Angular-Slickgrid Examples are tested with [Cypress](https://www.cypress.io/), there are over +500 Cypress E2E tests.
|
|
88
90
|
|
|
89
91
|
#### How to load data with `HttpClient`?
|
|
90
|
-
You might notice that all demos are coded with mocked dataset in each of the examples, that is mainly for demo purposes, but you might be wondering how to connect this with an `HttpClient`? Easy... just replace the mocked data, assigned to the `dataset` property, by your `HttpClient` call
|
|
92
|
+
You might notice that all demos are coded with mocked dataset in each of the examples, that is mainly for demo purposes, but you might be wondering how to connect this with an `HttpClient`? Easy... just replace the mocked data, assigned to the `dataset` property, by your `HttpClient` call and that's about it. The `dataset` property can be changed or refreshed at any time and it will be reflected in the grid, which is why you can use local data and/or connect it with a `Promise` or an `Observable` with `HttpClient` (internally it's just a SETTER that refreshes the grid). See [Example 24](https://ghiscoding.github.io/Angular-Slickgrid/#/gridtabs) for a demo showing how to load a JSON file with `HttpClient`.
|
|
91
93
|
|
|
92
94
|
## Main features
|
|
93
|
-
You can see some screenshots below and
|
|
95
|
+
You can see some screenshots below and some instructions below and if that is not enough for you to decide, head over to the [Wiki - Main Features](https://github.com/ghiscoding/Angular-Slickgrid/wiki).
|
|
94
96
|
|
|
95
97
|
## Troubleshooting Section
|
|
96
98
|
|
|
@@ -152,11 +154,11 @@ In Angular 14 and higher, Angular has a `strictTemplates` flag in your `tsconfig
|
|
|
152
154
|
|
|
153
155
|
> Property 'detail' does not exist on type 'Event'. (onAngularGridCreated)="angularGridReady($event.detail)"
|
|
154
156
|
|
|
155
|
-
The reason is because Angular-Slickgrid uses Custom Event for all its events and Angular complains because these Custom Events aren't typed. In order to fix this issue, you have 3 viable
|
|
157
|
+
The reason is because Angular-Slickgrid uses Custom Event for all its events and Angular complains because these Custom Events aren't typed. In order to fix this issue, you have 3 viable approaches:
|
|
156
158
|
|
|
157
159
|
1. disabled `strictTemplates` in your `tsconfig.json` config
|
|
158
160
|
2. cast the event in the View template to `$any` type
|
|
159
|
-
|
|
161
|
+
- `$any($event)` for example `$any($event).detail.eventData`
|
|
160
162
|
3. cast the event in the component ViewModel to `CustomEvent`
|
|
161
163
|
```html
|
|
162
164
|
<angular-slickgrid gridId="grid28"
|
|
@@ -12,6 +12,7 @@ interface CreateComponentOption {
|
|
|
12
12
|
export declare class AngularUtilService {
|
|
13
13
|
private vcr;
|
|
14
14
|
constructor(vcr: ViewContainerRef);
|
|
15
|
+
createInteractiveAngularComponent<C>(component: Type<C>, targetElement: Element, data?: any, createCompOptions?: CreateComponentOption): AngularComponentOutput;
|
|
15
16
|
/**
|
|
16
17
|
* Dynamically create an Angular component, user could also provide optional arguments for target, data & createComponent options
|
|
17
18
|
* @param {Component} component
|