import { Component , OnInit } from '@angular/core' ; @ Component ( { selector : 'app-row-click-event' , templateUrl : 'row-click-event.component.html' } ) export class RowClickEventComponent implements OnInit { pageTitle = 'Row click event' ; mdIntro = 'assets/docs/advanced/row-click/intro.md' ; mdHTML = 'assets/docs/advanced/row-click/source-html.md' ; mdTS = 'assets/docs/advanced/row-click/source-ts.md' ; message = '' ; dtOptions : DataTables . Settings = { } ; constructor ( ) { } someClickHandler ( info ) { this . message = info . id + ' - ' + info . firstName ; } ngOnInit ( ) { this . dtOptions = { ajax : 'data/data.json' , columns : [ { title : 'ID' , data : 'id' } , { title : 'First name' , data : 'firstName' } , { title : 'Last name' , data : 'lastName' } ] , rowCallback : ( row , data , index ) => { const self = this ; $ ( 'td' , row ) . off ( 'click' ) ; $ ( 'td' , row ) . on ( 'click' , ( ) => { self . someClickHandler ( data ) ; } ) ; return row ; } } ; } }