Category / Section
How to detect when the list item has been touched?
1 min read
Form components like Slider, Checkbox, Radio button...etc. will only support dirty checking by angular. And Syncfusion EJ2 Form components also supports Angular dirty checking.
ListView component is a Layout component, so it is not possible to check whether the ListView has been touched using "dirty" flag. However we can use select event in the ListView component to determine whether the user has touched or not.
The select event will be triggered whenever user interact with ListView.
Refer to the below code snippet.
[app.component.html]
<ejs-listview id="list" [dataSource]="data" (select)="onSelect($event)"></ejs-listview>
[app.component.ts]
import { Component } from '@angular/core';
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: [ './app.component.css' ]
})
export class AppComponent {
data: { [key: string]: Object }[] = [
{ text: 'Hennessey Venom', id: 'list-01' },
{ text: 'Bugatti Chiron', id: 'list-02' },
{ text: 'Bugatti Veyron Super Sport', id: 'list-03' },
{ text: 'SSC Ultimate Aero', id: 'list-04' },
{ text: 'Koenigsegg CCR', id: 'list-05' },
{ text: 'McLaren F1', id: 'list-06' },
{ text: 'Aston Martin One- 77', id: 'list-07' },
{ text: 'Jaguar XJ220', id: 'list-08' },
{ text: 'McLaren P1', id: 'list-09' },
{ text: 'Ferrari LaFerrari', id: 'list-10' },
];
onSelect(event): void {
alert('Listview has been touched');
}
}
Refer to the below Sample link
