AG Grid 中未设置多个复选框

Multiple checkboxes not being set in AG Grid

我的行上有复选框,我正在尝试 select 多个。当我单击一个时,它检查正常。如果我单击另一行上的一个复选框,该复选框 selects 但我所在的那个被取消 selected.

HTML:

<div>
  <ag-grid-angular
    #dataVisGrid
    style="width: 1000px; height: 500px;"
    class="ag-theme-balham"
    [rowData]="rowData"
    [columnDefs]="columnDefs"
    [rowSelection]="multiple"
    [rowMultiSelectWithClick]="true"
    [enableRangeSelection]="true"
    (rowClicked)="onRowSelect($event)">

  </ag-grid-angular>
</div>

数据可视化component.js

columnDefs = [
  {headerName: 'Data Source', field: 'dataSource', sortable: true, filter: true, checkboxSelection: true},
  {headerName: 'Value', field: 'value', sortable: true, filter: true},
  {headerName: 'State', field" 'state', sortable: true, filter: true}
];

onRowSelect(event) {
  console.log("onRowSelect:"+JSON.stringify(event));
}

如果我按住 Ctrl 键并单击该行,我可以看到多行突出显示(因为 enableRangeSelection)。但是,只有一个复选框有效。

根据文档,这似乎是您的设置方式 - 但出于某种原因,它对我不起作用。有人有什么想法吗?

将行选择设置为变量并将变量设置为"multiple"

[rowSelection]="rowSelection"

和组件内部

this.rowSelection = "multiple";

或者您可以删除环绕 rowselection

的 [ ]
rowSelection="multiple"

因为 multiple 是一个字符串而不是一个变量