Selection: {{ selected ? selected.name : '(none)' }}
@for (option of filteredOptionList; track option) { }
allowNull
disabled
dropdownOpen

The ux-input-dropdown component is a drop-down with flexible content. The content of the drop-down can be transcluded; the display of the closed component should be inserted into an ng-template with name displayContent.

The following can be used to customize and interact with the component:

If specified, the filter string will be set to the given value. If specified, the items provided will be selected. To programmatically modify the selection, assign a new array object to this property. If true, the filter field is not displayed. Maximum height of the drop-down. Placeholder to display inside the filter field. Note: The default value is not localized! Aria label of the filter field. If not specified, the placeholder will be used. ID of the element which serves as a label for the filter field. Aria label of the filter field search icon. Aria label of the filter field clear icon. If set to true this will programmatically show the typeahead dropdown. Controls the disabled state of the input-dropdown. Emits when the filter term changes. The event will contain the new filter string. Emits when the selection changes. The event will contain the new selected items. This event will be triggered when the dropdown is shown or hidden. The event will contain a boolean representing the visibility of the dropdown.

The sample code for the above example is: