如何在AngularJS UI-GRID中获取选定行的选定行

Question

I have an ui-grid in my application and I want to get the selected row when user select a row from the grid (single row selectable grid).

I know how to get the selected rows through gridApi when click on a button. But I'm unable to get a selected row immediately at the row selected event.

Answer 1

Need to register api function and use as shown below

 $scope.gridOptions.onRegisterApi = function(gridApi){

   $scope.gridApi = gridApi;

   gridApi.selection.on.rowSelectionChanged($scope, function(row){ 
    $scope.countRows = $scope.gridApi.selection.getSelectedRows().length;
    });

   gridApi.selection.on.rowSelectionChangedBatch($scope, function(row){ 
    $scope.countRows = $scope.gridApi.selection.getSelectedRows().length;
    });
}; 

Answer 2

You could bind ng-click on the row, that gets the $event.

Modify the template and reference the appScope

$templateCache.put('ui-grid/uiGridViewport',
    ....
    "<div ng-repeat=\"(rowRenderIndex, row) in rowContainer.renderedRows track by $index\"" +
    "ng-click=\"grid.appScope.onClickRow(row, $event)\"" +
    ....
);

Answer 3

JUST ADD :

gridApi.selection.on.rowSelectionChanged($scope,function(row){
    console.log(row.entity);
  });

in registor api function of ui grid. row.entity will give the selected row

more details here : http://ui-grid.info/docs/#/tutorial/210_selection