Search code examples
javascriptangularjshandsontable

How to get handle to the AngularJS ngHandsontable


I have a AngularJS project were I have a ngHandsontable defined in the HTML code. I am trying to get a handle to the table in order to attach a 'afterChange' hook to it. How do I get the handle to the table?

Code Example:

HTML

<div id="hoTableContainer">
<hot-table id="handsontableId" datarows="myData">
    <hot-column data="name" title="'Name'"></hot-column>
    <hot-column data="group" title="'Group'" readOnly></hot-column>
    <hot-column data="unit" title="'Unit'"></hot-column>
</hot-table>
</div>

Javascript

document.getElementById('handsontableId').addHook(...)
// Also tried:
var hotInstance = $("#hoTableContainer").handsontable('getInstance'); 

Solution

  • The events you are looking for are:

    All you have to do is, define a settings object in your controller:

    $scope.myAfterChangeHandler = function () {
        // your code
    };
    
    $scope.mySettings = {
         afterChange: $scope.myAfterChangeHandler
    };
    

    and then in your HTML, reference that setting object

    <hot-table id="handsontableId" datarows="myData" settings="mySettings">