Not able to instantiate Handsontable in angular component

Tags: #<Tag:0x00007efc65511ce8>
#1

After upgrading to Handsontable 7.1.0 and the Angular wrapper 5.0, I am unable to instantiate a Handsontable instance in my Angular component code. I get the error “Cannot use ‘new’ with an expression whose type lacks a call or construct signature.” when I try to instantiate Handsontable in the code below (code trimmed for brevity).

app.module.ts

import { HotTableModule } from '@handsontable/angular';

imports: [ HotTableModule ]

app.component.ts

import * as Handsontable from 'handsontable';

createTable() {
    var container = document.getElementById('hot-container');
    const hot = new Handsontable(container, {...});
}
#2

Hey @rgay

what was the last Handsontable version that you used before updating?

#3

I was on Handsontable 6.2.2 (handsontable-pro) and Angular wrapper 3.0.0 (@handsontable-pro/angular).

#4

I will test that out and be back with news.

#5

Thanks!

#6

Hey @rgay

Can you send over a .zipped project?
We could create a Angular 3.0.0/Handsontable 6.2.2 app and then update to the latest but if that would work we’d still do not know what happened on your end.

#7

Hi @aleksandra_budnik - I got it working! After reverting back to 6.2.2, I ran npm uninstall to remove all Handsontable dependencies, and then installed everything fresh. In my angular component, I changed the import to:

import Handsontable from ‘handsontable’;

From there, everything is working. Not sure if the uninstall/re-install was necessary, as the import statement is different than what I was trying before.

Thanks for looking into this!

#8

That’s great news. Thank you for the update.

#9