通过使用 typescript 选中 kendo ui 网格模块中的复选框来选择行答案

【问题标题】：Select row by checking the checkbox in kendo ui grid module with typescript通过使用 typescript 选中 kendo ui 网格模块中的复选框来选择行
【发布时间】：2025-12-13 17:05:01
【问题描述】：

我对 Kendo UI 和 Angular2 非常陌生。我正在使用带有 Angular2 的 Kendo ui。我在每一行都有一个带有复选框的网格模块。我想知道每行选择的 rowid 或任何字段值。如何在打字稿中做到这一点。下面的代码是app.component.ts

import { Component } from '@angular/core';
import { products } from './products';

@Component({
    selector: 'my-app',
    template: `
        <kendo-grid [data]="gridData" [height]="410">
            <kendo-grid-column field="ProductID" title="ID" width="40">
            </kendo-grid-column>
            <kendo-grid-column field="ProductName" title="Name" width="250">
            </kendo-grid-column>
            <kendo-grid-column field="Category.CategoryName" title="Category">
            </kendo-grid-column>
            <kendo-grid-column field="UnitPrice" title="Price" width="80">
            </kendo-grid-column>
            <kendo-grid-column field="UnitsInStock" title="In stock" width="80">
            </kendo-grid-column>
            <kendo-grid-column field="Discontinued" title="Discontinued" width="120">
                <ng-template kendoGridCellTemplate let-dataItem>
                    <input type="checkbox" [checked]="dataItem.Discontinued" enabled/>
                </ng-template>
            </kendo-grid-column>
        </kendo-grid>
    `
})
export class AppComponent {
    private gridData: any[] = products;
}

谁能帮我用打字稿来实现它。

【问题讨论】：

这里的任何人，谁在 Kendo UI 和 Angular2 工作，请帮助我

标签： angular typescript kendo-ui kendo-grid

【解决方案1】：

首先你必须在下面的代码中写 [selectable]="true" (selectionChange)="selectionChange($event)" 必须为真

  <kendo-grid [data]="view" [selectable]="true" [pageSize]="pageSize" [scrollable]="'none'" [pageable]="true" (pageChange)="pageChange($event)" (click)="openRecdoc()" (selectionChange)="selectionChange($event)">                                       <kendo-grid-column field="Status" class="uk-text-center">
      <template kendoGridHeaderTemplate class="uk-text-left">                                              Status
      </template>
          </kendo-grid-column>
      </kendo-grid>


and then typescript:
Wrote like this this is  "event.index" for getting specific row index

     protected selectionChange(event: SelectionEvent): void {
            var Index = event.index;
            var inNo = this.view1[RecurringIndex];
            this.glbData.No = inNo .DocumentID;
    }

我认为这对你有帮助谢谢

【讨论】：