Access portable methods / properties with nghandsontable

Question

I am using the ngHandsontable Angular directive for Handsontable . I managed to show the data successfully, but I'm struggling to access the modified rows so that I can send the data to the database.
I tried linking the afterChange callback, but the index seems to be disabled after sorting the columns. (shows the index of the row shown in the table, not the data source)

Interestingly, it is best to save ngHandsontable data or what I have to do to access the API as the getData method or columnSorting property

Many thanks for your help! - Marco

Answer 1

I ended up using the afterInit event to get an instance, and then will call methods in the following events, like afterChange.

This is what my code looks like:

afterInit: function() { $scope.hot.instance = this; } 

and then:

 afterChange: function (changes, source) { if (source != 'loadData') { var hot = $scope.hot.instance; var dataRow = hot.getSourceDataAtRow(index) // .... saveChanges... }; } 

Thanks a lot to Bricktop for the tip.

Answer 2

I just solved it with this logic:

 post: function postLink(scope, iElement, iAttrs, controller) { var hotDiv = iElement.find("div[hot-table]") var hotInstance = hotDiv.isolateScope().hotInstance; hotInstance.addHook('afterLoadData', function(){ console.log("loaded data"); }); } 

Answer 3

Just use the view model in the controller

 var vm = this; 

and then you can call any of the main methods that you can use to view this model, for example

 this.getCell() this.getSourceDataAtRow()