Data Binding
The ComboBox enables you to bind it to local data by using arrays of primitive and complex values as well as to remote data by using a service, an asynchronous source, or observables.
Binding to Local Data
When binding it to local data, the ComboBox provides options for:
- Binding to arrays of primitive data (strings, numbers, or other)
- Binding to arrays of complex data (objects)
Arrays of Primitive Data
The following example demonstrates how to bind the ComboBox to an array of primitive data.
Arrays of Complex Data
When the component is bound to objects, define the textField and valueField properties. The ComboBox will extract the value and text values from the selected data item and in this way will set the selected value and text.
If you do not intend to use an object as a value, bind the ComboBox to a primitive field value instead. For more information, refer to the article on value binding.
The following example demonstrates how to bind the ComboBox to an array of objects.
Binding to Remote Data
When binding it to remote data, the ComboBox provides options for:
Services
The following example demonstrates how to bind the ComboBox to remote data by using a service.
Async Pipe
The following example demonstrates how to bind the ComboBox to an asynchronous source.
Streaming of Data
You can also bind the ComboBox to asynchronous data (observables) by using the async pipe.
The following example demonstrates how to utilize this approach. It starts with an empty observable, produces one random value each second, and emits values in batches of five.