Angular Kendo 网格：Select 以编程方式行

Question

如何以编程方式 select Angular Kendo 网格行？不是通过用户界面，而是通过 selection 函数。例如，有没有办法以编程方式 select 第三行？

目前正在使用 Angular 10

资源：

https://www.telerik.com/kendo-angular-ui/components/grid/

Answer 1

您需要向 kendo 网格提供输入 [selectedKeys]，在加载网格时，您必须向该网格提供要选择的行的索引数组。如果稍后您想更改或更新选定的行，那么您可以相应地更新 selectedKeys 的数组。

Kendo 在这里提供了一个演示- https://www.telerik.com/kendo-angular-ui/components/grid/selection/#toc-during-data-operations

Answer 2

解决方案一：

Kendo 提供一种以编程方式 select 行的方法。您可以使用事件 rowSelected

它定义了一个布尔函数，该函数为组件中的每个数据行执行，并确定该行是否将被 selected。

<kendo-grid
    [data]="gridData"
    [height]="500"
    [selectable]="true"
    [rowSelected]="isRowSelected"
>

public gridData: any[] = products;
public mySelection: any[] = [1, 3, 5];

// Use an arrow function to capture the 'this' execution context of the class.
public isRowSelected = (e: RowArgs) => this.mySelection.indexOf(e.dataItem.ProductID) >= 0;

这是 link 和 运行演示 以及使用 Angular 10 的很好的解释.

Kendo-grid: Select Row Programatically using Angular

https://www.telerik.com/kendo-angular-ui/components/grid/selection/#toc-setting-the-selected-rows

方案二：

您可以使用 selectionKeys 动态设置它，以后任何人都可以更改 selection 但您的问题没有提到保留 selection 所以这个 link 应该结束讨论

https://stackblitz.com/edit/angular-10-decatechlabs

Angular Kendo 网格：Select 以编程方式行

Angular Kendo Grid: Select Row Programatically

telerik

kendo-ui

typescript

kendo-grid

angular