Событие щелчка строки на сетке Kendo-angular2

Question

Ниже приведена сетка, которую я разработал с использованием Kendo-Angular2. Мне нужно событие щелчка по строке, а в случае, если мне нужна информация о строке. Я написал общее событие щелчка и попытался получить информацию о строке, но она не работает, если я перехожу на вторую страницу в пагинации. Есть ли простое событие щелчка строки, которое дает информацию о строке.

plnkr: http://plnkr.co/edit/h0fVaP4NykRiILA7dyHn?p=preview

нажмите код события:

ngAfterViewInit() {
  this.renderer.listen(this.gridRef.nativeElement, "mousedown", (event) => {
    if (!event.target.matches('tbody>tr *')) {
      return;
    }

    const gridData = this.grid.data;
    const tr = event.target.closest('tr');
    const dataItem = gridData.data[tr.rowIndex + this.grid.skip];

    console.log(dataItem);
  });
}

Answer 1

Угловой шаблон

   <kendo-grid #gridUser
                  [kendoGridBinding]="gridData"
                  [pageSize]="10"
                  [pageable]="true"
                  [sortable]="true"
                  [selectable]="true"
                  (selectionChange)="gridUserSelectionChange(gridUser, $event)">
        <kendo-grid-column field="name" title="ID">
        </kendo-grid-column>
        <kendo-grid-column field="nameThai" title="Name">
        </kendo-grid-column>
        <kendo-grid-pdf fileName="User.pdf"></kendo-grid-pdf>
        <kendo-grid-excel fileName="User.xlsx"></kendo-grid-excel>
      </kendo-grid>

Угловой компонент

 gridUserSelectionChange(gridUser, selection) {
     // let selectedData = gridUser.data.data[selection.index];
     const selectedData = selection.selectedRows[0].dataItem;
     console.log(selectedData);
 }