从 Angular 2+ 中的 Kendo 网格中获取所选行的列表

Question

我在 Angular 4 应用程序中使用 Kendo for Angular 网格。我将 selectable 设置为“true”，我的网格中的一列带有 kendo-grid-checkbox-column，并将 selectionChange 设置为一个将事件参数作为参数的函数。

在我的 selectionChange 处理程序中，无论选择了多少行，事件参数上的 selectedRows 数组中都只有一个值。

谢谢，詹姆斯

我的代码：

    onGridSelectionChange(event: SelectionEvent) {
        debugger;
        console.log(event.selectedRows.length); // this is always 1
    };

<kendo-grid *ngIf='!isLoading' style="width:100%; height: inherit;" class="ag-fresh" [data]='gridView' [selectable]="true"
            [pageSize]='pageSize' [skip]='skip' [pageable]='true' (pageChange)='onGridPageChange($event)'
            (selectionChange)='onGridSelectionChange($event)'>

Answer 1

您使用了错误的网格事件。你应该使用selectedKeysChange

<kendo-grid ...
  [kendoGridSelectBy]="'id'"
  (selectedKeysChange)="selectedKeysChange($event)">
  ...
</kendo-grid>

此外，您还必须设置用于选择行 ( ) 的字段kendoGridSelectBy。在此示例中，它是 ID。

获取选择：

selectedKeysChange(rows: number[]) {
  console.log(rows);
}

Answer 2

看一下下面的例子：

例子

所有选定的键都保存在一个集合（mySelection）中，我们也可以通过编程方式操作该集合来选择/取消选择行。您可以保留代表所选数据项的整个对象，而不是保留键（将kendoGridSelectBy绑定到将返回 eventArgs.dataItem 的函数）。