Ag Grid 单击复选框调用函数

Question

checkboxSelection: true在 Angular & Javascript 中，我在其中一列中使用了 Ag-Grid 。

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

Answer 1

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

您可以使用selectionChanged事件绑定。每当您选择或取消选择该复选框时都会发出此事件。您可以在这里阅读更多相关内容。

但是，如果您想检查所选行是否已选中或未选中，最好绑定到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
}

这是一个演示。