獲取選擇的孔洞 object with kendo grid angular

Question

我想從劍道網格中選擇 object 而不僅僅是 id。

這是 HTML：

<kendo-grid [kendoGridBinding]="gridData"
 [selectable]="true"
 kendoGridSelectBy="id"
 [selectedKeys]="scriptID" 
 (selectedKeysChange)="editHandler($event)"
 >
<kendo-grid-column field="product" title="PRODUCT"> </kendo-grid- 
 column>
<kendo-grid-column field="page" title="PAGE"> </kendo-grid- 
column>
<kendo-grid-column field="script" title="SCRIPT"> </kendo-grid-column>
</kendo-grid>

在 typescript 中，我只得到了 id：

ngOnInit() {
  this.getAllScripts();
  }

getAllScripts(){
  this.scriptService.getAllRepairScripts().subscribe( data => {
    this.gridData = data;
  })
}
 editHandler($event){
  console.log($event) // $event contain the id 
  }

任何人都可以幫助我如何恢復孔 object 而不僅僅是 ID？

Answer 1

使用selectionChange事件。 It returns an object containing the unselected rows and selected rows whenever the selection changes. 您可以訪問所選每一行的dataItem ，其中包含所有數據。 你可以像這樣使用它：

<!-- Template -->
<kendo-grid [kendoGridBinding]="gridData" [selectable]="{mode: 'single'}" (selectionChange)="selectionChangeHandler($event)">

</kendo-grid>


// Component code
public selectionChangeHandler(e) {
    if (e && e.selectedRows && e.selectedRows[0] && e.selectedRows[0].dataItem) {
        console.log("selectionChangeHandler", e.selectedRows[0].dataItem);
    }
}

Answer 2

<!-- Template -->  
 
<kendo-grid [kendoGridBinding]="data" [kendoGridSelectBy]="onSelectedKey" [(selectedKeys)]="kendoSelectedItems"   (selectedKeysChange)="onSelectedKeysChange($event)"  
[height]="300" scrollable="virtual" >   
</kendo-grid>  
 
// Component code  

import { RowArgs} from '@progress/kendo-angular-grid'; 

 
  public kendoSelectedItems = [];  
 
  public onSelectedKey(context: RowArgs): any {  
    return context.dataItem;  
  }  
 
  public onSelectedKeysChange(e) {  
    console.log(this.kendoSelectedItems);  
  }