Skip to content 
Option 1Option 2Option 3Option 4
Radio select
Help text
RadioSelect ⚠️ Experimental
The RadioSelect component can be used imported from:
Playground
Parameters
Events
This component has events. Check the documentation about how to use the events.
| Name | Payload | Description |
|---|---|---|
ngModelChange | string | Returns the new value of the model |
restarted | void | Emitted on value reset |
blur | void | Emitted on blur |
validated | boolean | Emitted when the validation status changes |
Slots
This component has slots. Check the documentation about how to use the slots.
| Name | Tags | Description |
|---|---|---|
label | span | |
help-text | span |
Parameters use
Check the documentation about how to use the parameters.
options
The options parameter is used to set the options of the radio select. The option object should contain the text and value keys.
We can use <option> tags to define the values of options
We can use slots to define the content of the cards with the option-<value> slot.
label
The label parameter is used to set the text label of the component. Make sure you always use it.
We can also use the label slot:
config
The config parameter is used to display the radio select also inline. Setting config="inline" will display the radio select inline.
help-text
The help-text parameter is provide a text indication:
We can use se help-text slot to define the help text too:
name
The name parameter is used to set the name of the component. This is useful when the component is part of a form.
Flags
disabled
The disabled parameter is used to block the interaction with the component.
invalid
The invalid parameter is used make the whole input invalid.
The default text adapts to the localization:
Browser support
Detected engine:
Chromium
Webkit
Gecko
CodeSandbox example
Sorry, not available yet ☹️