How to access angular component from cells callback

In my cells callback I need to access some fields of the angular component which hosts the HOT.
When I do this:

<hot-table [cells]="cells" .....></hot-table>

Then I won’t be able to access the angular component from the cells callback using the this keyword.

In some example I saw the following:

<hot-table [cells]="cells.bind(this)" .....></hot-table>

This allows me to access the angular component from the cells callback as expected, but it breaks checkboxes.

This small StackBlitz demonstrates the two issues. If you run it with [cells]="cells.bind(this)", you can see that the checkboxes are not working properly (you need to click them multiple times before they eventually react). If you run it with [cells]="cells", then the checkboxes work smoothly, but I can’t access the angular component from the callback (you can see the “failed to access metadata” messages in the console).

So… what is the correct way to access the angular component from the cells callback?

Hi @robert.hegner

here’s a demo for the callback access https://stackblitz.com/edit/angular-5ykm8c?file=src/app/heroes/heroes.component.ts but it is literally used the same in methods.

Let me know if it works for you.

Using the “settings” binding to set up the callbacks as lambda functions did the trick!
Thank you so much!

1 Like