Hi,
I'm using a igx-hierarchical-grid with the load on demand for sub grids as stated in the demo : https://ko.infragistics.com/products/ignite-ui-angular/angular/components/hierarchicalgrid/hierarchical_grid.html
The problem is that when I expand a sub grid I get 2 errors
ERRORError: Cannot read property 'transactions' of undefined
ERRORError: Cannot read property 'instance' of undefined
I can't figure out what is wrong with my code
There is a full repro here : https://stackblitz.com/edit/bug-igx-hierarchical-grid
Can you help me with this ?
PS : On the stackblitz IGX version is 9.0.1 but I got the same problem on my repo where IGX version is 8.2.6PPS : You have more details in the error if you run this locally, see below
IgxHierarchicalGridComponent.html:80 ERROR TypeError: Cannot read property 'transactions' of undefined at IgxGridTransactionPipe.transform (igniteui-angular.js:57538) at checkAndUpdatePureExpressionInline (core.js:43600) at checkAndUpdateNodeInline (core.js:44371) at checkAndUpdateNode (core.js:44306) at debugCheckAndUpdateNode (core.js:45328) at debugCheckDirectivesFn (core.js:45271) at Object.eval [as updateDirectives] (IgxHierarchicalGridComponent.html:83) at Object.debugUpdateDirectives [as updateDirectives] (core.js:45259) at checkAndUpdateView (core.js:44271) at callWithDebugContext (core.js:45632)
IgxHierarchicalGridComponent.html:80 ERROR TypeError: Cannot read property 'instance' of undefined at IgxGridForOfDirective._recalcOnContainerChange (igniteui-angular.js:11411) at IgxGridForOfDirective.ngOnChanges (igniteui-angular.js:11650) at checkAndUpdateDirectiveInline (core.js:31906) at checkAndUpdateNodeInline (core.js:44367) at checkAndUpdateNode (core.js:44306) at debugCheckAndUpdateNode (core.js:45328) at debugCheckDirectivesFn (core.js:45271) at Object.eval [as updateDirectives] (IgxHierarchicalGridComponent.html:83) at Object.debugUpdateDirectives [as updateDirectives] (core.js:45259) at checkAndUpdateView (core.js:44271)
I’m glad to hear that!If you have any further questions, I’m here to help.
Cheers Petko
Nice this workaround is working great
I thought about it but I only put the cdr.detectChanges() in it but the grid.data needed it tooI'll still subscribe to your issue as I'm interested in the actual fix
Cheers
Hi Théo,
Thank you for contacting the Infragistics Support. And thank you for the sample as well!
After a brief investigation, I could state that the reason you get these errors is because at that point, the grid that’s passed in the event parameter of the onGridCreated event is not yet loaded.
I’d suggest wrapping the event.grid.data and the event.grid.cdr.detectChanges(); in a setTimeout. In this way, the operations that are invoked inside the callback function of the setTimeout would be executed in the next event loop, where the grid from the event will be taking place. I forked your sample and modified it to illustrate my explanations.
The scenario that you have approached though, is an obfuscating one because the load-on-demand feature supposes that you would have an outgoing http request that will take some time to get resolved (and that’s the most probable reason the grid’s not yet ready and needs the current event loop to be finished). In your sample, the data is being loaded instantly, just as in a regular hierarchical grid and that might be one reason not to have a track of the grid so far. In order to avoid further confusions and in case you are planning to continue with the use case that you are approaching so far, I’d suggest you to use a ViewChild reference to the grid and modify the data using it.
Even though, I logged an issue that we would refer to in order to find the reason, because of which the event parameter requires a new event loop. You can catch up with it here.
If you have any further questions, regarding this matter, feel free to get in touch with me.
Best regards, Petko Bozhinov, Infragistics, Inc.