Regarding afterOnCellMouseDown -Wrapper for Angular

Tags: #<Tag:0x00007f0b09b43758>

I am using Handsontable(Wrapper for Angular) with angular version 5 project. The html has defined afterOnCellMouseDown event inside hot-table element

[afterOnCellMouseDown]="afterOnCellMouseDownCallBack"  

Then in the angular component I have the function defined,

afterOnCellMouseDownCallBack(event, coords, TD) {

            if(this==null)   {
                               console.log("this value is null here afterOnCellMouseDownCallBack")
                             }
                  let checkBoxChecked = !event.target.checked;
     }

Basically I have a checkbox at header level. And when I click the checkbox, things are not working as expected.

I am having two issues:

1- As shown above, in afterOnCellMouseDownCallBack , the value of this reference is null.
2-The statement let checkBoxChecked = !event.target.checked;
produces following error.
Uncaught TypeError: Cannot read property ‘checked’ of undefined

Thanks

Hey @ntn62001

the hook runs the same whether you change the checkbox state or not. Demo https://stackblitz.com/edit/angular-pwirh5?file=src/app/hello.component.ts
You should also know that if you do not update the checkbox value via afterGetColHeader hook or colHeaders method it will change after render.

Yes actually ‘colHeaders’ is defined already but still it is not working. Even more I am concerned is that for all events triggered, the ‘this’ reference is always null. That is more problematic, because from any event triggered I cannot use reference to ‘this’. All my event handler functions are defined in the angular component, and all are getting called.

Also thanks for the link you provided. When I tried in that manner I am getting ‘this’ reference correctly, and mouse event is also fine . In that example they have used ‘settings’ for handsontable , but I am defining all my settings in hot-table for example

<hot-table [hotId]=“gridInstanceId”
[data]=“gridDataModel”
[afterLoadData]=“afterLoadDataEvent”
[afterInit]=“afterInitEvent”
[afterChange]=“afterChangeEvent”>

Thanks

Can you create a demo in StackBlitz (or just adjust mine) and send it over?

Ok I will refactor my code using the example you had given. I will keep you updated.

Thanks

I believe that the project is held or there’s no longer an issue as there’s no reply for a month so I’m closing this topic.