AngularJS + NG-Grid pass row.column.field into ng-click event

Question

How does one pass {{row.getProperty(col.field)}} into ng-click? What happens is the id does not get propagated back, but the grid render correctly with the id.

code:

var app = angular.module('testing',['ngGrid']);
app.config(['$locationProvider', function($locationProvider)  
{  
       $locationProvider.html5Mode(true);
}]);    

app.controller('TestCtrl',function($scope)  
{  
      $scope.details = []; //whatever dummy data  
      $scope.loadById = function(id)  
      {  
            $window.location.href= 'newPage/?id='+id;
      };  

      $scope.gridOptions =  
      {  
           data: 'details',  
           columnDefs:[{field:'id',DisplayName:'id',  
                 cellTemplate:'<div class="ngCellText" ng-class="col.colIndex()"><a ng-click="loadById({{row.getProperty(col.field)}})">{{row.getProperty(col.field)}}</a></div>'  
              }]
      };    
});

AardVark71 · Accepted Answer · 2013-11-07 10:18:17Z

14

You can just pass row in ng-click, instead of only the value outputted by the double brackets expression.

Your cellTemplate becomes this

cellTemplate:'<div class="ngCellText" ng-class="col.colIndex()"><a ng-click="loadById(row)">{{row.getProperty(col.field)}}</a></div>'

Your function becomes this

$scope.loadById = function(row) {  
   window.console && console.log(row.entity);
   $window.location.href= 'newPage/?id='+ row.entity.id;
};

answered Nov 7, 2013 at 10:18

AardVark71

4,1042 gold badges33 silver badges54 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

AngularJS + NG-Grid pass row.column.field into ng-click event

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related