I'm developing a website for my company, and I'm struggling while trying to trigger a function on cell's value click.
I'm using ui-grid and ControllerAs.
The function creating the table is inside my controller 'statusController':
function generateStatusCountChart()
{
var postData = {
'id' : vm.id,
'region' : vm.region,
'pageSize' : PAGE_SIZE,
'pageNum' : vm.pageNum
};
dashboardsService.getStatus(postData).then(function (results) {
vm.charts.statusCountChart.loading = true;
vm.charts.statusCountChart.gridData = statusViewGraph.statusCountChart(results);
vm.charts.statusCountChart.loading = false;
}).catch(function () {
vm.charts.statusCountChart.failure = true;
});
}
This is the function inside statusViewGraph service:
function statusCountChart(results) {
some code......
var chartConfig = gridData.generateGridOptions(data,gridData.getStatusCountFields());
return chartConfig;
}
And this is 'getStatusCountFields' inside 'gridData' factory:
function getStatusCountFields() {
var specificColumnDef = [
{
name: 'result',
displayName: 'Results',
cellClass: 'ui-grid-cell-contents',
cellToolTip: false,
minWidth: 50,
cellTemplate: '<div><a ng-click="grid.appScope.vm.FunctionInStatusController()">{{COL_FIELD}}</a></div>',
aggregationType: function (items) {
return 'Total Results: ' + $filter('number')(items.length);
}
},
{
name: 'count',
displayName: 'Count',
cellClass: 'ui-grid-cell-contents',
cellToolTip: true,
minWidth: 350,
cellTemplate: '<div style="overflow: auto">{{COL_FIELD}}</div>'
},
];
return specificColumnDef;
}
So basically, what I want to do, is to call a function which defined in 'statusController', and the trigger would be ng-click inside cellTemplate as seen above. Do you have any suggestions?