Can only access 'default' on Handsontable; can't access GridSettings

#1

Hello,

tldr: After importing Handsontable into my Angular component, I’m unable to access functions like Handsontable.renderers.TextRenderer(); instead, I must write Handsontable.default.renderers.TextRenderer().

Also, I can’t use Handsontable.GridSettings. Including Handsontable.GridSettings in my component gives this error:

Property ‘GridSettings’ does not exist on type ‘typeof import("/home/daniel/Angular/Projects/binbase-scheduler/node_modules/handsontable/handsontable")’

I’m working in Angular 9 and using:

“@handsontable/angular”: “^5.1.1”
“handsontable”: “^7.4.2”

I imported HotTableModule from ‘@handsontable/angular’ into my module, and I imported Handsontable into my component like:

import * as Handsontable from ‘handsontable’;
import { HotTableRegisterer } from ‘@handsontable/angular’;

I have “@import ‘~handsontable/dist/handsontable.full.css’;” in my styles/main.css file. I also included references to handsontable node_module files In my angular.json file like so ( which may be unnecessary):

“projects”: {
“binbase-scheduler”: {
…
“architect”: {
“build”: {
…
“options”: {
…
“styles”: [
“node_modules/handsontable/dist/handsontable.full.min.css”,
“src/styles.css”
],
“scripts”: [
“node_modules/handsontable/dist/handsontable.full.js”
]
…

Has anyone else had similar issues? How did you solve them?

#2

Hi @bluefrogjam

I am having similar issues as you, but when I switch to Angular 10 it all works fine. Is your project limited to Angular 9 or are you able to run the application using Angular 10?

#3

Also you can check this subject Handsontable 7 incompatibility with imports

Try importing Handsontable as a default: import Handsontable from 'handsontable' ;

#4

Thanks for your response! “import Handsontable from ‘handsontable’” removes the need to write ‘default’, however, I still can’t use GridSettings.

I have not tried Angular 10 yet. To my knowledge, there aren’t too many breaking changes when switching from 9 to 10, so it may be worthwhile to do so.

#5