javascript - Ag Grid单击复选框调用函数

在Angular＆Javascript中，我在其中一列中具有checkboxSelection: true的Ag-Grid。

每当单击任何行的复选框时，我都需要调用一个函数。
怎么做 ？？再次当在Ag-Grid中选中复选框时，如何调用函数？

最佳答案

我假设只有一列具有复选框选择。

您可以使用selectionChanged事件绑定。只要您选中或取消选中该复选框，就会发出此事件。您可以通过here阅读更多有关它的信息。

但是，如果要检查选中的行是选中还是未选中，则最好绑定到rowSelected事件。

例如，在component.html上，您可以将方法onSelectionChanged()绑定到selectionChanged事件。

<ag-grid-angular
    #agGrid
    style="width: 100%; height: 100%;"
    id="myGrid"
    class="ag-theme-balham"
    [columnDefs]="columnDefs"
    [defaultColDef]="defaultColDef"
    [suppressRowClickSelection]="true"
    [rowSelection]="rowSelection"
    [rowData]="rowData"
    (gridReady)="onGridReady($event)"
    (rowSelected)="onRowSelected($event)"
    (selectionChanged)="onSelectionChanged($event)"
  ></ag-grid-angular>

然后在您的component.ts上，定义onSelectionChanged()方法

onRowSelected(event) {
  console.log(event);
  console.log(event.node.selected);
  console.log(event.rowIndex);
}

onSelectionChanged(event) {
  console.log(event); // verify that the method is fired upon selection
  // do the rest
}

这是demo。