Chapters
English
github
DocsBlog
fontcolor_theme
Desktop UI

Select

PreviewHTML
Option A
arrows
Option A
arrows
Option A
arrows
Option A
arrows
Option A
arrows

Chosen: a

Option A
arrows
Resetarrow_down
Many items
arrows

API <dui-select>(source)

searchclear
This component is compatible with Angular Forms. You can use [(ngModel)] or formControlName with it.
Name
Description 
@Input() disabled?: boolean
@Input() placeholder?: string
@Input() required?: boolean
@Input() small?: boolean
Smaller text and height. 
@Input() textured?: boolean
Different textured styled. 
@Input() value?: T
@Output() disabledChange?: boolean
@Output() valueChange?: T
button: Signal<ButtonComponent>
dropdown: Signal<DropdownComponent>
element: ElementRef<HTMLElement>
error: boolean
label: string
options: Signal<>
optionsValueMap: Signal<Map<T, OptionDirective>>
valid: boolean
open(): void
select(value: T): void
setValue(value?: T): void

API <dui-option>(source)

searchclear

Directive to create an option in the select dropdown.

<dui-select>
    <dui-option value="1">Option 1</dui-option>
</dui-select>
Name
Description 
@Input() disabled?: boolean
@Input() value?: any
dynamic: DynamicOptionDirective
element: ElementRef<any>

API <dui-option-separator>(source)

Directive to create a separator in the select dropdown.

<dui-select>
    <dui-option value="1">Option 1</dui-option>
    <dui-option-separator></dui-option-separator>
    <dui-option value="2">Option 2</dui-option>
</dui-select>