Angular ui-grid行选择调用函数

时间:2015-05-15 16:30:59

标签: angularjs angular-ui-grid

我正在添加一个ui-grid,希望能够选择一行并调用一个函数。我还需要向整个行发送数据(实际只显示几列),但是我需要传递给函数的完整行。

以下是我对网格的选择:

    $scope.gridOptions = {
        enablePaginationControls: false,
        paginationPageSize: 25,
        multiSelect: false,
        columnDefs: [
            {
                name: 'userInfo.firstName',
                displayName: "First Name",
            }, {
                name: 'userInfo.lastName',
                displayName: "First Name"
            }
        ]
    };

1 个答案:

答案 0 :(得分:3)

您必须在html上使用ui-grid-selection指令并在gridOptions上启用行选择属性。一旦这样做,就可以捕获行选择,并且整个行数据可以用于进一步处理。

 $scope.gridOptions = {
 enableRowSelection: true,
        enablePaginationControls: false,
        paginationPageSize: 25,
        multiSelect: false,
        columnDefs: [
            {
                name: 'userInfo.firstName',
                displayName: "First Name",
            }, {
                name: 'userInfo.lastName',
                displayName: "First Name"
            }
        ]
    };

     $scope.gridOptions.onRegisterApi = function( gridApi ) {
        $scope.gridApi = gridApi;
           gridApi.selection.on.rowSelectionChanged($scope,function(row){
            var msg = 'row selected ' + row.isSelected;

            //Call your method here with the row object. row.entity will give the data.
          });
      };

在html中你需要添加ui

<div ui-grid="gridOptions" ui-grid-selection class="grid"></div>

这里有一个工作模型没有通话

http://plnkr.co/edit/OFoJydRpzoKAGBw3Tfzw?p=preview