Handsontable not rendering with Angular version 9

Tags: #<Tag:0x00007f34391144e0>

Hi @aleksandra_budnik,

In my project when I upgraded to Angular version to 9 I see that the handsontable is not rendered on UI. when I changed enableIvy to false it was working.

I tried to check is that the root cause and upgraded Angular version in one of the stackblitz project which was available on web.

I am not sure though it is because of enableIvy though for me it is causing the issue. Please find the below example from web.

Updating version to 9.1.13 giving issue and Ivy has been introduced in Angular version 9.

Stackblitz Link: https://stackblitz.com/edit/angular-handsontable-demo1-dm4dga?file=package.json

Please replace the dependencies to replicate the issue.

dependencies": { "@angular/animations": "9.1.13", "@angular/common": "9.1.13", "@angular/compiler": "9.1.13", "@angular/core": "9.1.13", "@angular/forms": "9.1.13", "@angular/platform-browser": "9.1.13", "@angular/platform-browser-dynamic": "9.1.13", "@angular/router": "9.1.13", "@handsontable-pro/angular": "^3.0.1", "core-js": "2.6.9", "handsontable-pro": "^6.2.3", "rxjs": "^7.1.0", "tslib": "^1.10.0", "zone.js": "^0.11.4" }

Also I have copied below error log which I encountered in browser console after upgrading to Angular version 9.

ERROR TypeError: Cannot read property 'nativeElement' of undefined at eval (hot-table.component.ts:324) at ZoneDelegate.invoke (zone.js:400) at Zone.run (zone.js:160) at NgZone.runOutsideAngular (ng_zone.ts:227) at HotTableComponent.ngAfterContentInit (hot-table.component.ts:323) at callProviderLifecycles (provider.ts:563) at callElementProvidersLifecycles (provider.ts:542) at callLifecycleHooksChildrenFirst (provider.ts:530) at checkAndUpdateView (view.ts:376) at callViewAction (view.ts:626)

Any help would be very much appreciated.

Thanks,
Rafeeq

Hi @rafi.rob231

Have you tried to upgrade your Handsontable to a newer version?

I’ve just built an Angular 9 with Ivy project using Handsontable for Angular 8.4.0 and it builds well, and we can use the table.

Here is the project https://we.tl/t-djJcQQTFAf (use npm i to install node modules)

Hi @aleksandra_budnik,

Worked.

Thank you so much for help.

Regards,
Rafeeq

Thank you for the feedback.

I’m glad that all works well now.