List

Preview

HTML

Form controls

Button

Button Group

Window

Toolbar

Sidebar

Buttons & Indicators

Checkbox

Radiobox

Select

Selected dui-list-item: button

API `<dui-list>`(source)

clear

This component is compatible with Angular Forms. You can use [(ngModel)] or formControlName with it.

@Input() delimiterLine?: boolean

@Input() disabled?: boolean

@Input() focusable?: boolean

@Input() required?: boolean

@Input() value?: any

@Input() white?: boolean

@Output() disabledChange?: boolean

@Output() valueChange?: any

error: boolean

id: number

ids: number

valid: boolean

getSelectedItem(): (undefined | ListItemComponent)

setValue(value: any): void

clear

Interactive item for a list. Supports router links, selection and more.

<dui-list>
 <dui-list-item value="1">Item 1</dui-list-item>
</list>

@Input() active?: boolean

@Input() position?: number

When position is dynamic, it might be handy to define the position explicitly to make arrow-up/arrow-down navigation possible.

@Input() value?: any

id: number

onSelect: EventEmitter<any>

isSelected(): boolean

select(): Promise<void>

Non-interactive title item for a list.

<dui-list>
 <dui-list-title>Title</dui-list-title>
 <dui-list-item value="1">Item 1</dui-list-item>
</list>