AutocompleteComponent
Component Metadata
Section titled “Component Metadata”Selector: yuv-autocomplete
Standalone: No
Implements: ControlValueAccessor, OnInit, OnDestroy
Inputs
Section titled “Inputs”addOnBlur
Section titled “addOnBlur”Type: boolean
Default Value: false
Add user inputs to the list of values when the user leaves the control without entering (only applicable for multiselect)
ariaLabel
Section titled “ariaLabel”Type: string
Default Value: ''
autocompleteValues
Section titled “autocompleteValues”Type: AutocompleteItem[]
Default Value: []
Type: boolean
Default Value: false
Show a loading spinner
distinctValues
Section titled “distinctValues”Type: boolean
Default Value: true
Force distinct values (only applicable for multiselect)
forceSelection
Section titled “forceSelection”Type: boolean
Default Value: false
Setting this to true will not allow values that are not contained in the suggestions list. The input will be cleared on blur if no value from the list has been selected. Also values are only emitted when a list item has been selected (usually every key stroke is changing the form controls value)
maxItems
Section titled “maxItems”Type: number
Default Value: -1
Maximum number of items when multiple is true. -1 means no limit.
minLength
Section titled “minLength”Type: number
Default Value: 2
Minimum number of characters entered to trigger suggestions
multiple
Section titled “multiple”Type: boolean
Default Value: false
Enable multiple values
disabled
Section titled “disabled”Type: BooleanInput
placeholder
Section titled “placeholder”Type: string
required
Section titled “required”Type: BooleanInput
Outputs
Section titled “Outputs”acBlur
Section titled “acBlur”Type: void
autocompleteFnc
Section titled “autocompleteFnc”Type: string
Properties
Section titled “Properties”_acValues
Section titled “_acValues”Type: unknown
Default Value: signal<AutocompleteItem[]>([])
chipsControl
Section titled “chipsControl”Type: unknown
Default Value: new FormControl<AutocompleteItem[]>([])
chipsInputDisabled
Section titled “chipsInputDisabled”Type: unknown
Default Value: computed( () => this.multiple() && this.maxItems() !== -1 && this.value && this.value.length >= this.maxItems() )
chipTemplate
Section titled “chipTemplate”Type: unknown
Default Value: contentChild('chipTemplate', \{ read: TemplateRef \})
Template to be used for rendering selected items in multiselect (multiple=“true”) mode
inputControl
Section titled “inputControl”Type: unknown
Default Value: new FormControl<AutocompleteItem | string>('', \{ nonNullable: true \})
matAutocomplete
Section titled “matAutocomplete”Type: unknown
Default Value: viewChild.required<MatAutocomplete>('auto')
ngControl
Section titled “ngControl”Type: unknown
Default Value: injectNgControl(this)
optionTemplate
Section titled “optionTemplate”Type: unknown
Default Value: contentChild('optionTemplate', \{ read: TemplateRef \})
separatorKeysCodes
Section titled “separatorKeysCodes”Type: number[]
Default Value: [ENTER, COMMA]
autofilled
Section titled “autofilled”Type: boolean
controlType
Section titled “controlType”Type: string
disableAutomaticLabeling
Section titled “disableAutomaticLabeling”Type: boolean
stateChanges
Section titled “stateChanges”Type: unknown
Default Value: new Subject<void>()
userAriaDescribedBy
Section titled “userAriaDescribedBy”Type: string
Methods
Section titled “Methods”acOptionActivated
Section titled “acOptionActivated”acOptionActivated(event: MatAutocompleteActivatedEvent): voidArguments
Section titled “Arguments”| Name | Type | Description |
|---|---|---|
| event | MatAutocompleteActivatedEvent |
acOptionSelected
Section titled “acOptionSelected”acOptionSelected(event: MatAutocompleteSelectedEvent): voidArguments
Section titled “Arguments”| Name | Type | Description |
|---|---|---|
| event | MatAutocompleteSelectedEvent |
acPanelClosed
Section titled “acPanelClosed”acPanelClosed(): voidadd(event: MatChipInputEvent): voidArguments
Section titled “Arguments”| Name | Type | Description |
|---|---|---|
| event | MatChipInputEvent |
displayFn
Section titled “displayFn”displayFn(i: AutocompleteItem): stringArguments
Section titled “Arguments”| Name | Type | Description |
|---|---|---|
| i | AutocompleteItem |
onInputBlur
Section titled “onInputBlur”onInputBlur(): voidregisterOnChange
Section titled “registerOnChange”registerOnChange(fn: function): voidArguments
Section titled “Arguments”| Name | Type | Description |
|---|---|---|
| fn | function |
registerOnTouched
Section titled “registerOnTouched”registerOnTouched(fn: function): voidArguments
Section titled “Arguments”| Name | Type | Description |
|---|---|---|
| fn | function |
removeItem
Section titled “removeItem”removeItem(item: AutocompleteItem): voidArguments
Section titled “Arguments”| Name | Type | Description |
|---|---|---|
| item | AutocompleteItem |
setDisabledState
Section titled “setDisabledState”setDisabledState(isDisabled: boolean): voidArguments
Section titled “Arguments”| Name | Type | Description |
|---|---|---|
| isDisabled | boolean |
writeValue
Section titled “writeValue”writeValue(value: unknown | AutocompleteItem): voidArguments
Section titled “Arguments”| Name | Type | Description |
|---|---|---|
| value | unknown | AutocompleteItem |
onContainerClick
Section titled “onContainerClick”onContainerClick(event: MouseEvent): voidArguments
Section titled “Arguments”| Name | Type | Description |
|---|---|---|
| event | MouseEvent |
onFocusIn
Section titled “onFocusIn”onFocusIn(): voidonFocusout
Section titled “onFocusout”onFocusout(): voidonNgOnDestroy
Section titled “onNgOnDestroy”onNgOnDestroy(): voidsetDescribedByIds
Section titled “setDescribedByIds”setDescribedByIds(ids: string[]): voidArguments
Section titled “Arguments”| Name | Type | Description |
|---|---|---|
| ids | string[] |