angularjs ng-grid computed column

Question

I'm trying to emulate a spreadsheet using AngularJS and ng-grid. My needs are simple but I cannot find anything anywhere that will help me fix my code.

I have a simple table of scores and in the last column I need a "Total Score" column.

You can see my code at this plunk.

My problem is that though I was able to get the total in each row on document.load, I cannot make the "Total" column update whenever any of the scores are changed.

Solution 1

Or alternatively, you could add the getTotal() function directly to the model object:

http://plnkr.co/edit/LhlK1C?p=preview

I prefer solutions where I don't have to work with $watch(), but it depends if you want the total to be stored in your model or only need it for display.

Solution 2

You could watch for changes to the 'original_data' object and recreate the process_data object every time updates.

http://plnkr.co/edit/c4iynItnznKNRoFgeuio?p=preview

Comments

[Noel Llevares]

I've read about $scope.$watch but never really understood how to use it until now. Thanks.

[vsp]

A quick performance comparison with Batarang in Chrome suggests that my solution might me slightly more performant that Clark's but that would have to be investigated in more detail. An explanation could be that Clark's solution has to create 2 deep copies of the entire data tree for each cell update (first for the user change, second for the total change), while mine only has to create one.

[Noel Llevares]

I like this solution but how do I get the original_data model back together with the additional column? Could there be a solution where I don't have to create 2 copies of the data tree?

[Thomas]

Solved my problem, thanks. Additionally, I prefer to add the computed fields in the service retrieving the data, inside the "transfromResponse" function so that the controller just receives the data with the fields.