jquery - Add directive to elements produced by ng-grid -

using ng-grid, developed simple application render excel sheet in ui. want fields(table headers) draggable, can drop them @ run time bins, - this. difference being, here dragging excel column header.

i can't figure out how add directive "draggable" generated ng-grid.

p.s. every column header has have own "draggable", may uniquely identify column number/name

angular code goes :

var sth = {"exceldata" : [{"name":"rohan","id":"1001.0","salary":"50000.0","age":"25.0"},{"name":"rohit","id":"1002.0","salary":"60000.0","age":"24.0"},{"name":"rahul","id":"1003.0","salary":"55000.0","age":"29.0"},{"name":"okay bye","id":"1004.0","salary":"88214.0","age":"32.0"}]};         $scope.mydata = sth.exceldata;         $scope.gridoptions = { data: 'mydata' }; 

in html, use:

<div class="gridstyle" ng-grid="gridoptions"> </div> 

here, name, id, salary, age, should independently , individually draggable.

p.s. given static json understanding. gets generated @ run time , may huge.