Angular 4 Kendo网格通过单击行而不是箭头

Question

我找到了这个链接，但已经有一段时间了，所以我想知道这是否已经实施。我很难找到解决方案来解决我想要完成的任务。

Opening the kendoDetailTemplate programmatically

Answer 1

当用户点击一个单元格时，您可以利用cellClick事件和expandRow功能打开详细信息行。

有关这些选项（以及更多）的详细信息，请参见API Reference。

*。HTML

<kendo-grid
    (cellClick)="onCellClick($event)"
>
    ...
</kendo-grid>

* TS

onCellClick(event: CellClickEvent) {
    event.sender.expandRow(event.rowIndex);
}

我还准备了一个Plunker来显示上面的代码。

Answer 2

声明您为child

 @ViewChild('grid') private grid;

然后从onclick调用以下方法。将行索引作为参数传递。

 expandRow(i: number) {
  this.isRowExpanded = !this.isRowExpanded;
  this.isRowExpanded ? this.grid.collapseRow(i) : this.grid.expandRow(i);

}

您可以通过以下方式获取行索引

ng-template kendoGridCellTemplate let-dataItem let-rowIndex="rowIndex"