Select
Displays a list of options for the user to pick from—triggered by a button.
Usage
Selected value:
Native Select
Selected value: apple
A lighter alternative to volt-select for simple cases: it's the real native <select> element (full mobile/native picker behavior, works with formControl/ngModel for free), styled to match the theme.
API Reference
VoltNativeSelect — select[voltNativeSelect]
| Input | Type | Default |
|---|---|---|
| disabled | boolean | false |
VoltSelectItem — volt-select-item
| Input | Type | Default |
|---|---|---|
| value | unknown | undefined |
| disabled | boolean | false |
VoltSelect — volt-select
| Input | Type | Default |
|---|---|---|
| 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) |
| Output | Type |
|---|---|
| valueChange | unknown |
Component Source
Install via CLI:
npx @voltui/cli add selectTypeScript
Loading editor…
Copy this code to your project. The component uses ng-primitives/select.