Components
    • Buttons
    • Charts
    • Conversational UI
    • Data Query
    • Date Inputs
    • Date Math
    • Dialogs
    • Drawing
    • Dropdowns
    • Editor
    • Excel Export
    • File Saver
    • Gauges
    • Grid
    • Icons
    • Indicators
    • Inputs
    • Labels
    • Layout
    • ListView
    • Menus
    • Navigation
    • Notification
    • Pager
    • PDF Export
    • Popup
    • ProgressBars
    • Ripple
    • Scheduler
    • ScrollView
    • Sortable
    • ToolBar
    • Tooltip
    • TreeList
    • TreeView
    • Uploads
    Styling & Themes
    Common Features
    Project Setup

ListItemModel

Represents the item models of the Kendo UI DropDownButton and SplitButton components. These are the interface fields that the items use.

@Component({
selector: 'my-app',
template: `
 <kendo-splitbutton [data]="listItems">SplitButton</kendo-splitbutton>
`
})
class AppComponent {
  public listItems: ListItemModel[] = [{
     text: 'item1',
     icon: 'refresh',
     click: (dataItem: any) => {
         //action
     }
 }, {
     text: 'item2',
     iconClass: 'test icon class',
     click: (dataItem: any) => {
         //action
     }
 }, {
     text: 'item3',
     imageUrl: 'https://demos.telerik.com/kendo-ui/content/web/toolbar/upload.png',
     click: (dataItem: any) => {
         //action
     }
 }, {
     text: 'item4',
     disabled: true,
     click: (dataItem: any) => {
         //action
     }
 }]
}

click?

(dataItem?: any) => void

An event handler that is emitted when an item is clicked.

disabled?

boolean

When set to true, disables a button list item.

icon?

string

Defines an icon to be rendered next to the title.

iconClass?

string

Defines an icon with a custom CSS class to be rendered next to the title.

imageUrl?

string

Defines the location of an image to be displayed next to the title.

text?

string

Sets the text of the item.

In this article

Not finding the help you need?