DevExtreme Angular - Universal Actions

Universal actions are those actions that raise the same event despite being performed differently on desktop platforms and on touch-enabled devices. For example, both a click and a tap on an item raise the itemClick event. To handle it, assign a function to the onItemClick option, or subscribe to this event using the on(eventName, eventHandler) method.

jQuery
JavaScript
$(function() {
    $("#listContainer").dxList({
        // ...
        onItemClick: function(e) {
            // Event handling commands go here
        }
    });
});
JavaScript
var itemClickEventHandler1 = function(e) {
    // First handler of the "itemClick" event
}

var itemClickEventHandler2 = function(e) {
    // Second handler of the "itemClick" event
}

$("#listContainer").dxList("instance")
    .on("itemClick", itemClickEventHandler1)
    .on("itemClick", itemClickEventHandler2)
Angular
HTML
TypeScript
<dx-list ...
    (onItemClick)="onItemClick($event)">
</dx-list>
import { DxListModule } from 'devextreme-angular';
// ...
export class AppComponent {
    onItemClick (e) {
        // Event handling commands go here
    }
}
@NgModule({
    imports: [
        // ...
        DxListModule
    ],
    // ...
})

The List supports other universal actions, which are provided as a part of basic List functionality. They are described in the following topics.

See Also