How to call a scope method from a button displayed in ngGrid -in Angular js

Question

angular.module(\'harbinger\').controller(
   \'Admin.UserlistController\',  
   function($rootScope, $scope, $location, $http, userService)
   {
      // etc
      $         


        

Answer 1

Maybe it's an old question but I'll answer it.

ngGrid creates an isolated scope so there is no way of getting to your parent scope via something like this:

1. $parent.editUser('')
2. <div ng-controller="AppCtrl as ctrl"><div ng-grid="options"></div></div> and ctrl.editUser('')
3. by using . ($scope.callback = {}; $scope.callback.editUser = function(){}; -> callback.editUser(''))

ngGrid uses your options in the isolated scope, which is available to your cell/rowTemplates - so you can do as follows:

Javascript Controller:

$scope.editUser = function(userName) {
    ...
};

$scope.options = {
    data: 'data',
    columnDefs: [{
        field:'name', 
        displayName:'name', 
        cellTemplate: '<div ng-click="options.editUser(\'{{row.entity.userName}}\')">Edit</div>'
    }],
    editUser: $scope.editUser
}

HTML:

<div ng-grid="options"></div>

Plunker: Test app