Select
Показує список варіантів на вибір, який відкриває кнопка.
Використання
Selected value:
Нативний select
Selected value: apple
Легша альтернатива до volt-select для простих випадків: це справжній нативний елемент <select> (повна поведінка мобільного та системного вибору, працює з formControl/ngModel без зусиль), стилізований під тему.
Довідник API
VoltNativeSelect — select[voltNativeSelect]
| Вхід | Тип | За замовчуванням |
|---|---|---|
| disabled | boolean | false |
VoltSelectItem — volt-select-item
| Вхід | Тип | За замовчуванням |
|---|---|---|
| value | unknown | undefined |
| disabled | boolean | false |
VoltSelect — volt-select
| Вхід | Тип | За замовчуванням |
|---|---|---|
| placeholder | string | 'Select an option' |
| ariaLabel | string | '' |
| value | unknown | undefined |
| disabled | boolean | false |
| multiple | boolean | false |
| compareWith | (a: unknown, b: unknown) => boolean | Object.is |
| dropdownPlacement | Placement | 'bottom-start' |
| container | string | HTMLElement | null | 'body' |
| flip | NgpFlipInput | true |
| scrollToOption | ((index: number) => void) | undefined | undefined |
| allOptions | unknown[] | undefined | undefined |
| displayWith | (value: unknown) => string | value => String(value) |
| Вихід | Тип |
|---|---|
| valueChange | unknown |
Код компонента
Встановити через CLI:
npx @voltui/cli add selectTypeScript
Завантаження редактора…
Скопіюйте цей код у свій проєкт. Компонент використовує ng-primitives/select.