New to Kendo UI for Angular? Start a free 30-day trial
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: 'arrow-rotate-cw',
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
}
}]
}| Name | Type | Default | Description |
|---|---|---|---|
click? |
|
An event handler that is emitted when an item is clicked. | |
cssClass? |
|
The CSS classes that will be rendered on the item element. Supports the type of values that are supported by ngClass. | |
disabled? |
|
When set to | |
icon? |
|
Defines an icon to be rendered next to the title. | |
iconClass? |
|
Defines an icon with a custom CSS class to be rendered next to the title. | |
imageUrl? |
|
Defines the location of an image to be displayed next to the title. | |
svgIcon? |
|
Defines an SVGIcon to be rendered next to the title. | |
text? |
|
Sets the text of the item. |
