单击单元格按钮时如何获取网格的行数据

时间:2021-06-29 06:36:03

标签: angular kendo-ui

我有一个剑道网格

<kendo-grid [data]="gridData">
  <kendo-grid-column field="iban" title="IBAN">
  </kendo-grid-column>
  <kendo-grid-command-column title="command">
    <ng-template kendoGridCellTemplate>
      <button class="btn btn-success" (click)="btnCommand($event)">Approve</button>
    </ng-template>
  </kendo-grid-command-column>
</kendo-grid>

目前Approve按钮只是发布事件点击事件,如何发布整行数据?

这里是事件处理程序

btnCommand($event) {
  console.log($event)
}

1 个答案:

答案 0 :(得分:1)

您可以使用 <ng-template> 签名将参数传递给 let 标记。并将其作为参数发送回事件处理程序。

试试下面的方法

<ng-template kendoGridCellTemplate let-data>
  <button class="btn btn-success" (click)="btnCommand(data)">Approve</button>
</ng-template>

事件处理程序:

public btnCommand(data: any) {
  console.log(data);
}

更新:附加按钮

如果你需要额外的按钮具有不同的事件处理行为,最好绑定不同的事件处理程序。

模板 (*.html)

<ng-template kendoGridCellTemplate let-data>
  <button class="btn btn-success" (click)="onApprove(data)">Approve</button>
  <button class="btn" (click)="onDecline(data)">Decline</button>
</ng-template>

控制器 (*.ts)

public onApprove(data: any) {
  console.log(data);
  // do something else
}

public onDecline(data: any) {
  console.log(data);
  // do something else
}