ComboBoxLegacy deprecated LEGACY

Examples API Setup
Source code
This version of the component is deprecated and will be removed in the next major version. Use new version of ComboBox instead!

ComboBox is a textfield with a dropdown with items. You can choose one of available options or input a value manually.

Async data loading

#
If you need to set some attributes or listen to events on native input , you can put it inside with Textfield directive as shown below
Alex Inkin
Alex Inkin
Alex Inkin

DataList

#

ID only

#
If you receive your id to text mapping from the server, you would need to recreate items and stringify when new data comes, so they will be observables and you would need async pipe in the template
Darth Vader

Selected value: 3

DataListWrapper

#

Stringify

#

With filtering through tuiFilterByInput pipe

Virtual scroll

#
Note that virtual scroll can imperatively remove focused option from DOM. This causes ExpressionChange errors and to solve those take a look at a tiny IndexChange directive included in this example.

Options (stringify)

#

Don't allow disabled options to be selected by typing them

#

Selected value: null